How do Stack Overflow desktop notifications work? - javascript

Perhaps this is a fairly big and ambiguous question:
In the Stack Overflow chatrooms, there is a button to "enable desktop notifications," which will show something in the system tray when someone replies to you.
By what mechanism does this work? It's always made me curious.
How does a website access the system tray?

It uses the Notification object (i.e. var n = new Notification("Hello");) to provide local notifications on a per-website basis. Each browser implements the standard differently (see Chrome, Firefox, and Safari), but they all operate essentially the same way, sending notifications based on the permissions they have (window.Notification.permission), which can be default (hasn't been asked, in which case you would window.Notification.requestPermission();), granted, or denied. Opera and Internet Explorer do not support desktop notifications at this time.

They're called Desktop Notifications, which use the Notifications API.
Basically, the site checks for Notifications API support, then the user grants or denies the website permission to display notifications.
Here is more information on how the API works.

This is with the help of WebSockets - Web APIs. There is actually a persistent connection between the client and the server. And also both parties can start sending data at any time.

Related

Browser Chat Without internet

Can anyone explain me the possibilities of creating a web chat (i.e similar to whatsappweb) which works without internet connections the only possible way that these device communicate is either by WiFi or Bluetooth (i.e Peer to peer). If it is not possible on earth could then explain why?
I've come across some javascript files like peer.js. But it uses internet i think. I want it to work without internet connectivity.
Thanks in advance.
With WebRTC it is possible to establish peer-to-peer communication between web-browsers in the same local network: https://developer.mozilla.org/en-US/docs/Web/Guide/API/WebRTC/Peer-to-peer_communications_with_WebRTC
A server is only needed for communication outside of a local network: http://blog.vline.com/post/63765098884/webrtc-if-its-p2p-why-do-i-need-a-server
There is another demonstration in this page: https://hacks.mozilla.org/2013/05/embedding-webrtc-video-chat-right-into-your-website/
However WebRTC is a relatively new system that is not widely supported - so consider it experimental at this stage - but it has the backing of Mozilla, so it might end-up somewhere.
However you are limited to the capabilities that WebRTC provides - and as your code is still JavaScript that runs in the browser you will not have access to any kind of actual networking API (such as Berkeley Sockets) or lower-level control of hardware, such as the ability to create Ad-hoc Wi-Fi networks, new Bluetooth Personal Area Networks, or LE Bluetooth connections... at present.
Google is working on making a Bluetooth API available that runs in the browser. Presently it is only available to Chrome Extensions, but it may soon be available in web-pages in general: https://developers.google.com/web/updates/2015/07/interact-with-ble-devices-on-the-web
Ofcourse there is a way to make this happen. You would have to set up a webserver on the device with this webapp. You could then connect with localhost or 127.0.0.1 . Other people would have to join your hotspot and connect to your ip address.
If you want to connect automaticly you would have to write a real app.
Browsers run in a "contained" mode. No hardware access is possible from any script ran inside the browser, thus there's no way to initialize and setup the device to start direct communication.

How do i send browser messages even if website closed? [duplicate]

My goal is to send Gmail-style desktop notifications in Chrome or Firefox from a web app (let's call it X) that is NOT currently open in the browser, without requiring the user to install an app or extension. It's okay if the user needs to grant permission to receive notifications from X, and it's okay if the browser needs to be open for the notification to appear, as long as X doesn't need to be open in the browser. A solution that doesn't require any browser window to be open would also work.
I just spent the day digging into this, and so far I think I've learned:
Since OSX Mavericks, it has been possible to do this in Safari 7+ via Safari Push Notifications.
The Web Notifications API works in Chrome/Firefox, but requires the user's browser to be open to X.
Twitter sends similar web notifications without asking the user for permission first, but requires the user's browser to be open to Twitter.
There are lots of references to possible Growl implementations, but as far as I can tell, all of them require the user to install Growl and/or a Growl-enabled app to work.
I could be wrong about any of my statements above - I'd love to hear it! - and I'm open to any other solution too. Any ideas?
Thanks for reading.
You can send push notifications even when your web page is not active using Service Workers, the Notification API for service workers and the push API for server-initiated notifications (or scheduled notifications).
As of June 2016, Service Workers are supported in Chrome, Firefox and Opera. See the status at https://jakearchibald.github.io/isserviceworkerready/
See the following links for related discussions, status of implementation and specifications.
Service workers are enabled by default since Chrome 40, Firefox 33, and Opera 24. See the HTML5Rocks tutorial and MDN.
Push notifications: Chrome 42+, Firefox 44+
You can do exactly what you are looking for using the W3C Push API.
If you want to build everything from scratch I suggest to start reading this tutorial by Google. It is for Chrome, but Firefox works in a very similar way.
However it's a lot of work and the "standard" is still evolving: I suggest that you use a service like Pushpad (I am the founder).

How to initiate a new device pairing using the Chrome web bluetooth API?

Using navigator.bluetooth.requestDevice(), I can access bluetooth devices I've already set up a pair with using native OSX bluetooth pairing, but no previously-unpaired devices appear, even when their attributes match my generic query. Available devices show up in a Chrome modal requesting user consent to pair, but the only device that shows up is the one I've already paired with.
Am I misunderstanding the intended use case here, or is there another way to establish a connection with a nearby (previously unpaired) device from Chrome?
Docs: https://webbluetoothcg.github.io/web-bluetooth/
(See Example 2)
function bluetoothConnect() {
navigator.bluetooth.requestDevice({filters: [{services: ['generic_access']}]})
.then(device => {console.log(`Connected to: ${device.name}`)})
.catch(console.error);
}
First, Mac OS X is not yet fully implemented as we speak. Only discovery and GATT server connect/disconnect are working for now. See the Chrome Implementation status at https://github.com/WebBluetoothCG/web-bluetooth/blob/gh-pages/implementation-status.md. Check out Chrome OS, Linux and Android M (Android Lollipop workaround).
Regarding your specific issue, I believe that generic_access is not broadcasted by a nearby BLE device but is found because you've already paired (cached) this device. If your device is named "foo" for instance, you can go to https://googlechrome.github.io/samples/web-bluetooth/device-info.html and fill "foo" as the Device Name and hit "Get Bluetooth Device Info" button.
I would recommend you give a try to all Web Bluetooth samples at https://googlechrome.github.io/samples/web-bluetooth/index.html as well.
To complement the other answer, please be aware of the Chrome's chrome://bluetooth-internals tab/tool. This tool can not only list available devices and their services (which I don't think you can do with the Web Bluetooth API unless you requested the services in optionalServices or filters/services) and the characteristics of those services.
In the device list, there is a Forget button which becomes active once you connect to the devices GATT server using the Inspect button. This should allow you to full unpair and pair again in cases where you need to test the flow end to end.
Edit: Actually after doing some experimentation around this, the device still remains paired even after using the Forget button. Probably a bug in Chrome, however, the cache of the paired devices seems to be per-profile. This means the real answer is to:
Use the Incognito mode and in there the pairing flow will initiate from the get-go for each new Incognito session.

Configuring maximum number of simultaneous open WebSockets (in IE)

I've got this JS application. All client side JS communicating with a third party stream server via web sockets. I have about 18 different web sockets open for one page. Firefox and Chrome handle this many open web sockets at once just fine. IE11 seems to have a limitation of 4 open web sockets at once. Once I open that 5th web socket, regardless of socket call to the third-party server, I get an error thrown by IE, which closes the socket and gives the general error "SecurityError" and expanding the proto section it gives me . Seems to be pretty generic errors from my searches. At first I thought there may be a trusted zone type issue with IE, but I've added the client site to my trusted zone as well as the server providing the data.
This post provides info on max number of websockets for Firefox & Chrome, but I don't see anything specific about IE. Are there any known limitations to IE and web sockets? Answered, see edit below.
This MDN site talks about increasing the max value, but again, I can't find anything about IE. Is there some IE setting to up the amount of open connections? Answered: see below edit.
EDIT: This site shows the max connections settings for IE. It looks like it's a registry setting in Windows that controls the amount of web socket connections. Interestingly enough, I don't have that registry Key anywhere, but there is still a limit for this. The page speaks of IE10, and I'm working with IE11 specifically. Does anyone know if there are registry settings for this in regards to IE11? Has anyone just added these feature web socket registry keys and solved this issue?
The MSDN documentation you referenced is clear on the default being 6 concurrent connections (which means if not specified in the registry, that's what you'll get); and, if the documentation doesn't specify differently, it's probably safe to assume newer versions of Internet Explorer act in the same way as version 10.
Try setting through group policy. It worked for me.
https://jwebsocket.org/documentation/reference-guide/internet-explorer-tips

Dealing with iOS Captive Network Support

So, I'm building a Guest Internet portal for a public hotspot in a hotel. This means the portal is served through a Network Access Gateway (a Nomadix) that redirects all outgoing traffic to the portal page. The portal needs to be able to set cookies on the browser so that Guests can be automatically logged back in after they idle timeout.
The Problem:
iOS4+ and OS X (10.7+) Devices have a feature called Captive Network Support. This feature continuously scans for Wifi SSIDs, connects to them, and curls http://www.apple.com/library/test/success.html to see if the device is connected to the internet. If it doesn't get the Success response, these devices pop open whats called a Captive Network Portal. This portal is not a true version of Safari Mobile and you cannot save cookies on this browser.
I would like an authoritative answer to the following question:
With client-side javascript/markup can I?
A) Save cookies within the Captive Network (popup) browser
B) Prevent the Captive Network browser from popping up in the first place without whitelisting apple.com
This is kinda the wrong site in the StackExchange network for sysadmin stuff; you may wish to try ServerFault. In my experience as a user, there are WiFi portals out there that manage reauthentication without cookies; perhaps ServerFault can help you find such.
That said, there's one possible solution in terms of iOS client-side development: There are CaptiveNetwork APIs which allow a third-party app to inform the system that it's assumed responsibility for authenticating to particular SSIDs, suppressing the web sheet. It's likely not a desirable solution, since it requires your users to install an app, but it's there.
You could try serving "http://www.apple.com/library/test/success.html" locally when ever an iOS device is detected. This will make the CNA not pop up and then the user could login through mobile safari, in which you can save cookies.
iOS 14 has a new API for work with a captive portal. Btw, Android supports it too

Categories

Resources