StompJS

STOMP library for JavaScript/TypeScript.

StompJs v5+: Polyfills

2 minute read

This guide covers critical dependencies and polyfills for version 5+ of @stomp/stompjs; which is internally used by all versions of @stomp/rx-stomp and version 7+ of @stomp/ng2-stompjs.

Critical dependency

StompJs v5+ uses newer Javascript features. Few of these can be polyfilled in older browsers. However Uint8Array (Browser Support) is critically needed and not possible to be efficiently polyfilled (notably in IE9 or lower). If you need to support any browser that does not have native support for Uint8Array please continue using version 4 of this library.

Older Microsoft Browsers

The latest version of Edge does not need any polyfills.

TextEncoder/TextDecoder - IE and older Edge

  • TextEncoder and TextDecoder - Browser Support These are not supported by any older versions of MicroSoft browsers (supported by latest Edge).
  • These will need to be polyfilled from npm package text-encoding. A simple approach: 
    <script src="https://cdn.jsdelivr.net/npm/text-encoding@0.6.4/lib/encoding.min.js"></script>

Object.assign - IE

  • Object.assign. (Browser Support) It is not supported by IE (supported by Edge).
  • It will need to be polyfilled from npm package es6-object-assign. A simple approach: 
    <script src="https://cdn.jsdelivr.net/npm/es6-object-assign@1.1.0/dist/object-assign-auto.min.js"></script>

In NodeJS

WebSocket

There are two alternate libraries websocket and ws which have been reported to work.

websocket

  • Add websocket npm module:

    $ npm install websocket

  • Require the module and expose it through global

    Object.assign(global, { WebSocket: require('websocket').w3cwebsocket });

ws

  • Instead of websocket lib ws has also been reported to work. See: stompjs/issues/28.

  • Add ws npm module:

    $ npm install ws

  • Require the module and expose it through global

    Object.assign(global, { WebSocket: require('ws') });

TextEncoder/TextDecoder

  • Node JS v11 (tested with v11.2.0) has TextEncoder/TextDecoder built-in. See: https://nodejs.org/api/util.html#util_class_util_textencoder
  • For older NodeJS, you need to install text-encoding 
    $ npm install text-encoding

  • Add the following:

    // These have been added in NodeJS v11, so good idea is to check first
if (typeof TextEncoder !== 'function') {
  const TextEncodingPolyfill = require('text-encoding');
  TextEncoder = TextEncodingPolyfill.TextEncoder;
  TextDecoder = TextEncodingPolyfill.TextDecoder;
}

In React Native

TextEncoder/TextDecoder

  • React Native makes it deceptive. When an application is executed in debug mode, it works, as it is executed on an actual browser where TextEncoder/TextDecoder is available. However, when executed in production mode, it fails as TextEncoder/TextDecoder is not available.
  • Please install text-encoding 
    $ npm install text-encoding

  • Add the following to your index.js or App.js:

    import * as encoding from 'text-encoding';
  • There are additional issues with React Native in some device/version combinations. Please see: React Native - Additional Notes

Updated: