Twilio Programmable Chat with React Native

Question

I am trying to add Twilio Chat to my react native project. I'm getting an error with the name SyncError and code 0. I'm just trying to confirm it's connected at this point. Here's my basic setup.

Import at the top

import {Client as Chat} from 'twilio-chat'

Inside my class

componentDidMount = async () => {
    console.log(Chat);
    const token = await AsyncStorage.getItem('auth-token');
    axios.get(config.apiUrl + '/chat/details', { headers: { Authorization: token } })
      .then(res => {
        console.log(res);
        Chat.create(res.data.twilioToken)
          .then(client => {
            console.log('client', client);
            this.subscribeToAllChatClientEvents(client);
          })
          .catch(error => {
            console.log('There was an error', error);
          });
      })
      .catch(err => {
        console.log(err);
      })
  }

The error also mentions an "Unhandled promise rejection" but I've included any catch blocks where needed.

Thanks for any help.

At what point are those errors thrown? – philnash Jun 02 '19 at 22:13 — philnash, Jun 02 '19 at 22:13

score 0 · Accepted Answer · answered Jun 15 '19 at 09:50

0

For anyone getting the same issue. I realised that the problem was in my server code as I wasn't creating the twilio jwt token properly.

answered Jun 15 '19 at 09:50

Matt Leach

839
3
10
15

score 0 · Answer 2 · answered Dec 13 '19 at 16:19

There's likely a problem with the token.

In my experience, I got a good token from my backend server and I save it on AsyncStorage. However, after a while the token wasn't working anymore.

I solved it by requesting the server a new twilio token each time I needed to instantiate the SDK client.

Twilio Programmable Chat with React Native

2 Answers2