Twilio TaskRouter в Django / React JS

#django #reactjs #django-rest-framework #twilio #twilio-taskrouter

#django #reactjs #django-rest-framework #twilio #twilio-taskrouter

Вопрос:

Я создаю простое приложение для контакт-центра с использованием Twilio. Я создаю токен рабочих возможностей TaskRouter в своем бэкэнде следующим образом: Сериализатор:

 class TwilioTokenSerializer(serializers.BaseSerializer):
    def to_representation(self, instance):
        return {
            'token': instance,
        }
  

Вид:

 class TwilioWorkerView(generics.RetrieveAPIView):
    serializer_class = TwilioTokenSerializer
    def get_object(self):
        current_user = self.request.user.worker
        worker_sid   = current_user.worker_sid
        # Returns a Twilio Worker token for current agent
        capability = WorkerCapabilityToken(
            account_sid=TWILIO_ACCOUNT_SID,
            auth_token=TWILIO_AUTH_TOKEN,
            workspace_sid=TWILIO_WORKSPACE_SID,
            worker_sid=worker_sid
        )

        capability.allow_fetch_subresources()
        capability.allow_update_activities()
        capability.allow_update_reservations()
        token = capability.to_jwt()

        token = capability.to_jwt(ttl=28800)
        return token
  

В react:

 import { Worker } from 'twilio-taskrouter';

componentDidMount(){
  axios.get('https://myURL.com/api/twilio-worker-token')
    .then(res =>{
        console.log(res.data.token)
        const worker = new Worker(res.data.token)
    }).catch(error =>{
      console.log(error)
    })

  

но я получаю ошибку веб-сокета 403:

 index.window.js:24 WebSocket connection to 'wss://event-bridge.twilio.com/v1/wschannels?token=(here the token)amp;closeExistingSessions=falseamp;clientVersion=0.5.2' failed: Error during WebSocket handshake: Unexpected response code: 403
createWebSocket @ index.window.js:24
(anonymous) @ index.window.js:24
index.js:1 WebSocket error occurred:  Event {isTrusted: true, type: "error", target: WebSocket, currentTarget: WebSocket, eventPhase: 2, …}
console.<computed> @ index.js:1
<computed> @ index.window.js:17
webSocket.onerror @ index.window.js:24
error (async)
createWebSocket @ index.window.js:24
(anonymous) @ index.window.js:24
setTimeout (async)
webSocket.onclose @ index.window.js:24
index.window.js:17 Uncaught n {_errorData: {…}, name: "GATEWAY_CONNECTION_FAILED", message: "Could not connect to Twilio's servers."}
r.emit @ index.window.js:17
(anonymous) @ index.window.js:17
r.emit @ index.window.js:17
webSocket.onerror @ index.window.js:24
error (async)
createWebSocket @ index.window.js:24
(anonymous) @ index.window.js:24
setTimeout (async)
webSocket.onclose @ index.window.js:24
index.js:1 Uncaught Error: The error you provided does not contain a stack trace.
    at S (index.js:1)
    at V (index.js:1)
    at index.js:1
    at index.js:1
    at u (index.js:1)
  

Те же настройки отлично работают с html с cdn taskrouter
разница между тем, когда я использую cdn и библиотеку react twilio-taskrouter, заключается в URL-адресе веб-сокета, причем более поздний вариант не включает ни SID учетной записи, ни рабочий SID.

Чего мне не хватает?

Ответ №1:

Я понял, я использовал неправильный токен, с библиотекой twilio-taskrouter я должен был использовать токен доступа с предоставлением TaskRouter в отличие от использования токена рабочих возможностей TaskRouter.

 class TwilioWorkerView(generics.RetrieveAPIView):
    serializer_class = TwilioTokenSerializer
    def get_object(self):
        current_user   = self.request.user
        username = current_user.username
        agent_sid      = current_user.agent.agent_sid
        access = AccessToken(TWILIO_ACCOUNT_SID, TWILIO_API_KEY, TWILIO_API_SECRET)
        taskrouter_grant = TaskRouterGrant(workspace_sid=TWILIO_WORKSPACE_SID, worker_sid=agent_sid, role='worker')
        access.add_grant(taskrouter_grant)
        access.identity = username
        token = access.to_jwt()
        return token
  

Комментарии:

1. У меня эта библиотека работает нормально. npmjs.com/package/twilio-taskrouter