sockjs-client
Advanced tools
SockJS-client is a browser JavaScript library that provides a WebSocket-like object. SockJS gives you a coherent, cross-browser, Javascript API which creates a low latency, full duplex, cross-domain communication channel between the browser and the web se
The sockjs-client npm package provides a browser JavaScript library that provides a WebSocket-like object that offers a consistent, cross-browser interface for real-time, bi-directional communication between the client and the server. It falls back to a variety of browser-specific transport protocols if WebSockets are not available.
Establishing a connection to a SockJS server
This code sample demonstrates how to establish a connection to a SockJS server. It creates a new SockJS client instance, sets up event listeners for 'open', 'message', and 'close' events, and logs information to the console when these events occur.
var sock = new SockJS('http://mydomain.com/my_prefix');
sock.onopen = function() {
console.log('open');
};
sock.onmessage = function(e) {
console.log('message', e.data);
};
sock.onclose = function() {
console.log('close');
};Sending messages to the server
This code sample shows how to send a message to the server using the SockJS client. It sends a JSON stringified object as the message content.
sock.send(JSON.stringify({message: 'Hello, server!'}));Receiving messages from the server
This code sample illustrates how to receive messages from the server. It sets up an event listener for the 'message' event and logs the received message to the console after parsing the JSON data.
sock.onmessage = function(e) {
var message = JSON.parse(e.data);
console.log('Received message:', message);
};Closing the connection
This code sample demonstrates how to close the connection to the server using the SockJS client.
sock.close();The 'websocket' npm package provides client and server implementations of the WebSocket protocol. It is more focused on providing a low-level WebSocket API and does not include the same level of fallback options for older browsers or environments that do not support WebSockets, unlike sockjs-client which provides a variety of fallbacks.
The 'socket.io-client' package is the client-side library of Socket.IO, which enables real-time bidirectional event-based communication. It is similar to sockjs-client in providing fallbacks for WebSockets, but it also offers additional features like auto-reconnection, event broadcasting, and rooms for organizing clients, which sockjs-client does not provide out of the box.
The 'engine.io-client' is the client component of Engine.IO, the core of Socket.IO. It is responsible for handling the connection transport, including long-polling and other fallback mechanisms. It is similar to sockjs-client in terms of providing reliable connections in diverse environments but is typically used as part of the larger Socket.IO framework.
SockJS is a browser JavaScript library that provides a WebSocket-like object. SockJS gives you a coherent, cross-browser, Javascript API which creates a low latency, full duplex, cross-domain communication channel between the browser and the web server.
Under the hood SockJS tries to use native WebSockets first. If that fails it can use a variety of browser-specific transport protocols and presents them through WebSocket-like abstractions.
SockJS is intended to work for all modern browsers and in environments which don't support the WebSocket protocol -- for example, behind restrictive corporate proxies.
SockJS-client does require a server counterpart:
Philosophy:
Subscribe to SockJS mailing list for discussions and support.
SockJS family:
Work in progress:
SockJS mimics the WebSockets API,
but instead of WebSocket there is a SockJS Javascript object.
First, you need to load the SockJS JavaScript library. For example, you can put that in your HTML head:
<script src="//cdn.jsdelivr.net/sockjs/1.0.0/sockjs.min.js"></script>
After the script is loaded you can establish a connection with the SockJS server. Here's a simple example:
var sock = new SockJS('http://mydomain.com/my_prefix');
sock.onopen = function() {
console.log('open');
};
sock.onmessage = function(e) {
console.log('message', e.data);
};
sock.onclose = function() {
console.log('close');
};
sock.send('test');
sock.close();
Similar to the 'WebSocket' API, the 'SockJS' constructor takes one, or more arguments:
var sockjs = new SockJS(url, _reserved, options);
Where options is a hash which can contain:
server (string)
String to append to url for actual data connection. Defaults to a random 4 digit number.
transports (string OR array of strings)
Sometimes it is useful to disable some fallback transports. This option allows you to supply a list transports that may be used by SockJS. By default all available transports will be used.
sessionId (number OR function)
Both client and server use session identifiers to distinguish connections. If you specify this option as a number, SockJS will use its random string generator function to generate session ids that are N-character long (where N corresponds to the number specified by sessionId). When you specify this option as a function, the function must return a randomly generated string. Every time SockJS needs to generate a session id it will call this function and use the returned string directly. If you don't specify this option, the default is to use the default random string generator to generate 8-character long session ids.
Although the 'SockJS' object tries to emulate the 'WebSocket' behaviour, it's impossible to support all of its features. An important SockJS limitation is the fact that you're not allowed to open more than one SockJS connection to a single domain at a time. This limitation is caused by an in-browser limit of outgoing connections - usually browsers don't allow opening more than two outgoing connections to a single domain. A single SockJS session requires those two connections - one for downloading data, the other for sending messages. Opening a second SockJS session at the same time would most likely block, and can result in both sessions timing out.
Opening more than one SockJS connection at a time is generally a bad practice. If you absolutely must do it, you can use multiple subdomains, using a different subdomain for every SockJS connection.
| Browser | Websockets | Streaming | Polling |
|---|---|---|---|
| IE 6, 7 | no | no | jsonp-polling |
| IE 8, 9 (cookies=no) | no | xdr-streaming † | xdr-polling † |
| IE 8, 9 (cookies=yes) | no | iframe-htmlfile | iframe-xhr-polling |
| IE 10 | rfc6455 | xhr-streaming | xhr-polling |
| Chrome 6-13 | hixie-76 | xhr-streaming | xhr-polling |
| Chrome 14+ | hybi-10 / rfc6455 | xhr-streaming | xhr-polling |
| Firefox <10 | no ‡ | xhr-streaming | xhr-polling |
| Firefox 10+ | hybi-10 / rfc6455 | xhr-streaming | xhr-polling |
| Safari 5 | hixie-76 | xhr-streaming | xhr-polling |
| Opera 10.70+ | no ‡ | iframe-eventsource | iframe-xhr-polling |
| Opera 12.10+ | rfc6455 | xhr-streaming | xhr-polling |
| Konqueror | no | no | jsonp-polling |
†: IE 8+ supports [XDomainRequest]1, which is essentially a modified AJAX/XHR that can do requests across domains. But unfortunately it doesn't send any cookies, which makes it inappropriate for deployments when the load balancer uses JSESSIONID cookie to do sticky sessions.
‡: Firefox 4.0 and Opera 11.00 and shipped with disabled Websockets "hixie-76". They can still be enabled by manually changing a browser setting.
Sometimes you may want to serve your html from "file://" address - for development or if you're using PhoneGap or similar technologies. But due to the Cross Origin Policy files served from "file://" have no Origin, and that means some of SockJS transports won't work. For this reason the SockJS transport table is different than usually, major differences are:
| Browser | Websockets | Streaming | Polling |
|---|---|---|---|
| IE 8, 9 | same as above | iframe-htmlfile | iframe-xhr-polling |
| Other | same as above | iframe-eventsource | iframe-xhr-polling |
| Transport | References |
|---|---|
| websocket (rfc6455) | [rfc 6455]2 |
| websocket (hixie-76) | [draft-hixie-thewebsocketprotocol-76]3 |
| websocket (hybi-10) | [draft-ietf-hybi-thewebsocketprotocol-10]4 |
| xhr-streaming | Transport using [Cross domain XHR]5 [streaming]6 capability (readyState=3). |
| xdr-streaming | Transport using [XDomainRequest]1 [streaming]6 capability (readyState=3). |
| eventsource | [EventSource]7. |
| iframe-eventsource | [EventSource]7 used from an [iframe via postMessage]8. |
| htmlfile | [HtmlFile]9. |
| iframe-htmlfile | [HtmlFile]9 used from an [iframe via postMessage]8. |
| xhr-polling | Long-polling using [cross domain XHR]5. |
| xdr-polling | Long-polling using [XDomainRequest]1. |
| iframe-xhr-polling | Long-polling using normal AJAX from an [iframe via postMessage]8. |
| jsonp-polling | Slow and old fashioned [JSONP polling]10. This transport will show "busy indicator" (aka: "spinning wheel") when sending data. |
Although the main point of SockJS is to enable browser-to-server connectivity, it is possible to connect to SockJS from an external application. Any SockJS server complying with 0.3 protocol does support a raw WebSocket url. The raw WebSocket url for the test server looks like:
You can connect any WebSocket RFC 6455 compliant WebSocket client to this url. This can be a command line client, external application, third party code or even a browser (though I don't know why you would want to do so).
You should use a version of sockjs-client that supports the protocol used by your server. For example:
<script src="//cdn.jsdelivr.net/sockjs/0.3.4/sockjs.min.js"></script>
For server-side deployment tricks, especially about load balancing and session stickiness, take a look at the SockJS-node readme.
SockJS-client needs node.js for running a test server and JavaScript minification. If you want to work on SockJS-client source code, checkout the git repo and follow this steps:
cd sockjs-client
npm install
To generate JavaScript, run:
gulp browserify
To generate minified JavaScript, run:
gulp browserify:min
Both commands output into the build directory.
Once you've compiled the SockJS-client you may want to check if your changes pass all the tests.
make test-local
This will start zuul and a test support server. Open the browser to http://localhost:9090/_zuul and watch the tests run.
There are various browser quirks which we don't intend to address:
jsonp-polling transport will show a "spinning wheel" (aka. "busy indicator")
when sending data.onmessage or such is probably a
bad idea, as it could be called by the built-in postMessage API.http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx ↩ ↩2 ↩3
http://tools.ietf.org/html/draft-hixie-thewebsocketprotocol-76 ↩
http://tools.ietf.org/html/draft-ietf-hybi-thewebsocketprotocol-10 ↩
https://secure.wikimedia.org/wikipedia/en/wiki/XMLHttpRequest#Cross-domain_requests ↩ ↩2
https://developer.mozilla.org/en/DOM/window.postMessage ↩ ↩2 ↩3
http://cometdaily.com/2007/11/18/ie-activexhtmlfile-transport-part-ii/ ↩ ↩2
FAQs
SockJS-client is a browser JavaScript library that provides a WebSocket-like object.
The npm package sockjs-client receives a total of 2,367,964 weekly downloads. As such, sockjs-client popularity was classified as popular.
We found that sockjs-client demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Attackers used a malicious npm package typosquatting a popular ESLint plugin to steal sensitive data, execute commands, and exploit developer systems.
Security News
The Ultralytics' PyPI Package was compromised four times in one weekend through GitHub Actions cache poisoning and failure to rotate previously compromised API tokens.
Security News
Research
Socket researchers found a malicious Maven package impersonating the legitimate ‘XZ for Java’ library, introducing a backdoor for remote code execution.