React Native - warn message sends Can't find variable: TextEncoder

[omars94]

I am using Stompjs to connect with Apache ActiveMQ and Spring Server but when I run application I receive a console warning message and after I navigate to another Screen with lots of data I receive this error non-stop as if it went to a loop.

Error:

 [Unhandled promise rejection: ReferenceError: Can't find variable: TextEncoder]
- node_modules/@stomp/stompjs/bundles/stomp.umd.js:1538:30 in Parser
- node_modules/@stomp/stompjs/bundles/stomp.umd.js:1832:16 in start
- ... 13 more stack frames from framework internals

I believe this has to do with the package rather than my code

const stompConfig = {
    reconnectDelay: 100,
    heartbeatIncoming: 0,
    heartbeatOutgoing: 0,
    debug: function(str) {
      console.log(str);
    }
  }

  stompConfig.webSocketFactory = () => {
    return new SockJS(
        "http://192.168.1.2:8080/"
    );
  };
  client = new Client(stompConfig);

  client.onConnect = function(frame) {
    console.log('frame', frame.body);
  };

  client.onStompError = function(frame) {
    console.log('Broker reported error: ', frame.headers['message']);
    console.log('Additional details: ', frame.body);
  };

  client.activate();

[kum-deepak]

TextEncoder and TextDecoder are needed by this library. Please see the following article for details on how to get poly-fills:

https://stomp-js.github.io/guide/stompjs/rx-stomp/ng2-stompjs/2018/06/28/pollyfils-for-stompjs-v5.html

[kum-deepak]

I am closing this, if it is still unresolved, please open a new issue.

[mseyfayi]

@kum-deepak this article page is not found :'(

[kum-deepak]

Please try https://stomp-js.github.io/guide/stompjs/rx-stomp/ng2-stompjs/2018/06/29/pollyfils-for-stompjs-v5.html

[mseyfayi]

@kum-deepak Thanx

[kum-deepak]

For react native, please also check https://stomp-js.github.io/workaround/stompjs/rx-stomp/ng2-stompjs/2019/06/10/react-native-null-chopping-issue.html

[mseyfayi]

that doesn't work for me!!!

[mseyfayi]

I tried nodejs solution in my react code and it's worked!!!!!!! (I don't know why :D) @kum-deepak thanks

[ufukomer]

@kum-deepak thanks for the link @madsams thanks for telling where to focus :)

React Native already supports WebSocket thus we only need to add text-encoder to global TextEncoder, TextDecoder objects:

const TextEncodingPolyfill = require('text-encoding');

Object.assign(global, {
  TextEncoder: TextEncodingPolyfill.TextEncoder,
  TextDecoder: TextEncodingPolyfill.TextDecoder,
});

[ArjunPatidar-numero]

@ufukomer @kum-deepak I'm getting the same Can't find variable: TextEncoder when adding the package npm install josefor key generation. How can I resolve my project is in react native expo. @ufukomer Your answer is not clear to me.

[kum-deepak]

I do not use React Native myself. Please check https://stomp-js.github.io/guide/stompjs/rx-stomp/ng2-stompjs/pollyfils-for-stompjs-v5.html#in-react-native which is based on information as reported by others.

[ArjunPatidar-numero]

@madsams Hey which solution you tried for Can't find variable: TextEncoder error can please tell me the process, It'll be helpfull.

[benodeveloper]

@kum-deepak thanks for the link @madsams thanks for telling where to focus :)

React Native already supports WebSocket thus we only need to add text-encoder to global TextEncoder, TextDecoder objects:

const TextEncodingPolyfill = require('text-encoding');

Object.assign(global, {
  TextEncoder: TextEncodingPolyfill.TextEncoder,
  TextDecoder: TextEncodingPolyfill.TextDecoder,
});

this solved the problem, thank you 😁