Heroku Node.js Развертывание чата WebSocket Sever - PullRequest
Новая
       29

Heroku Node.js Развертывание чата WebSocket Sever

0 голосов
/ 23 мая 2019

Сервер Websocket не подключается после развертывания на heroku:

Я уже просмотрел документацию и учебник по heroku.

Я могу запустить приложение локально, но у меня возникают проблемы при развертывании heroku.,Пользовательский интерфейс работает, но, похоже, не подключается к серверной части.Procfile как было обновлено.

URL-адрес подключения клиента должен быть изменен на localhost: 8989 для локальной работы.Когда я жестко запрограммировал URL в клиенте перед развертыванием, ошибка в консоли такая же, как и в том случае, если я не запускаю сервер websocket, работающий с npm start локально.

https://github.com/kbventures/chatTest Внешний интерфейс:

    import * as types from '../constants/ActionTypes';
    import { addUser, messageReceived, populateUsersList } from '../actions';

    const setupSocket = (dispatch, username) => {
      const socket = new WebSocket('wss://boiling-brook-76849.herokuapp.com');

      //const HOST = location.origin.replace(/^http/, 'ws');
      //const socket = new WebSocket(HOST);

      socket.onopen = () => {
        socket.send(
          JSON.stringify({
            type: types.ADD_USER,
            name: username
          })
        );
      };
      socket.onmessage = event => {
        const data = JSON.parse(event.data);
        switch (data.type) {
          case types.ADD_MESSAGE:
            dispatch(messageReceived(data.message, data.author));
            break;
          case types.ADD_USER:
            dispatch(addUser(data.name));
            break;
          case types.USERS_LIST:
            dispatch(populateUsersList(data.users));
            break;
          default:
            break;
        }
      };
      return socket;
    };

export default setupSocket;

Back end: 

const WebSocket = require('ws');

const port = process.env.PORT || 8989;

const wss = new WebSocket.Server({ port });

const users = [];

const broadcast = (data, ws) => {
  wss.clients.forEach(client => {
    if (client.readyState === WebSocket.OPEN && client !== ws) {
      client.send(JSON.stringify(data));
    }
  });
};

wss.on('connection', ws => {
  let index;
  ws.on('message', message => {
    const data = JSON.parse(message);
    switch (data.type) {
      case 'ADD_USER': {
        index = users.length;
        users.push({ name: data.name, id: index + 1 });
        ws.send(
          JSON.stringify({
            type: 'USERS_LIST',
            users
          })
        );
        broadcast(
          {
            type: 'USERS_LIST',
            users
          },
          ws
        );
        break;
      }
      case 'ADD_MESSAGE':
        broadcast(
          {
            type: 'ADD_MESSAGE',
            message: data.message,
            author: data.author
          },
          ws
        );
        break;
      default:
        break;
    }
  });

  ws.on('close', () => {
    users.splice(index, 1);
    broadcast(
      {
        type: 'USERS_LIST',
        users
      },
      ws
    );
  });
});

Локально список пользователей будет заполняться, обновляться, и в консоли браузера не будет ошибок.

Чтобы воспроизвести ошибку, перейдите по адресу:

https://boiling -brook-76849.herokuapp.com /

Введите сообщение и проверьтеконсоль для следующей ошибки:

index.js: 2178 uncaught at handleNewMessage в handleNewMessage в takeEvery at
Ошибка: не удалось выполнить 'send' в 'WebSocket': все еще в состоянии CONNECTING

...

index.js: 5 Сбой подключения WebSocket к 'wss: //boiling-brook-76849.herokuapp.com/': Ошибка при рукопожатии WebSocket: Неожиданный код ответа: 503

...