CODEWITHSUNDEEP
javascriptandroidwebsocket
Steven
Steven

Reputation: 2114

What is the best way to detect websocket support using Javascript?

I'm trying to use Javascript to detect if a web browser supports websockets, but using only feature-based detection, I'm getting false positives, so I added a user agent test to throw out Android devices instead, which I'm not happy about. I have a Samsung Galaxy Tab 2, and here's my detection code:

var isSupported = (("WebSocket" in window && window.WebSocket != undefined) ||
                   ("MozWebSocket" in window));

/* This line exists because my Galaxy Tab 2 would otherwise appear to have support. */
if (isSupported && navigator.userAgent.indexOf("Android") > 0)
  isSupported = false;

if (isSupported)
  document.write("Your browser supports websockets");
else
  document.write("Your browser does not support websockets");

This code seems to work with IE, Firefox, Safari (including iPhone/iPad), and Chrome. However, the feature-based check is returning true when I use the default browser of my Samsung Galaxy Tab 2, which is incorrect because that browser does not actually support websockets. Furthermore, I don't know how many other Android devices have this same issue, so at the moment, this is the best solution I'm aware of for detection.

Is there a better way to detect websocket support other than what I'm doing? I do realize that workarounds exist for Android, such as using a different browser, which means my user agent detection code as-is would not be a good thing. My goal is to not have to rely on the user agent in the first place.

Any suggestions?

Upvotes: 21

Views: 18937

Answers (5)

cskwg
cskwg

Reputation: 849

None of the above answers by itself was sufficient in my tests. The following code seems to be working fine:

    function nll( o ) { return CS.undefined === typeof o || null === o; }
    // ...
    function check_ws_object() {
        try {
            var websocket = new WebSocket( "wss://echo.websocket.org" );
            return true;
        } catch ( e ) { ; }
        return false;
    }
    //
    function check_support() {
        if ( !( WebSocket in window ) ) {
            if ( nll( window.WebSocket) ) {
                if ( !this.check_ws_object() ) {
                    alert( "This browser doesn't support HTML5 Web Sockets!" );
                    return false;
                }
            }
        }
        return true;
    },

The above tests are sorted, so that the faster ones come first.

Upvotes: 1

kroko
kroko

Reputation: 131

This page comes on top in google search.

In year 2016 cutting the mustard for modern WebSockets implementation (no prefixes such as MozWebSocket) would be

if (
  'WebSocket' in window && window.WebSocket.CLOSING === 2
) {
 // supported
}

http://www.w3.org/TR/websockets/#the-websocket-interface

Upvotes: 7

Isaiah Turner
Isaiah Turner

Reputation: 2662

This is the shortest solution and is used by Modernizr. Simply add this to your code

supportsWebSockets = 'WebSocket' in window || 'MozWebSocket' in window;

then you can use it by running

if (supportsWebSockets) {
     // run web socket code
}

Upvotes: 23

jfaron
jfaron

Reputation: 147

after reading @gzost's response.. I started tinkering.. since nothing else can properly detect WS's on my android phone... even websocket.org says i have it, but then fails to connect.

Anyways, try this workaround.. seems to properly detect it on/off with chrome, FF, safari and the default android browser.

var has_ws=0;
function checkWebSocket(){
  try{
    websocket = new WebSocket("ws:websocket.org");
    websocket.close('');
  }catch(e){ //throws code 15 if has socket to me babies
    has_ws=1;
  }
}

$(document).ready(function(){
  checkWebSocket();
});

Upvotes: 6

Rob M.
Rob M.

Reputation: 36511

I think the Modernizr library is what you are looking for: http://modernizr.com/

Once you include the library on your page, you can use a simple check like:

if(Modernizr.websockets){
    // socket to me baby
}

Upvotes: 7

Related Questions