Когда я загружаю приложение JS React на сервер heroku, не удалось создать веб-сокет.

Это проблема, вызванная последним обновлением реагирующего сценария. Снизьте пакет своих реактивных скриптов до 3.2 на данный момент.

npm install react-script@3.2 

https://github.com/facebook/create-react-app/pull/8079#issuecomment-562373869

Вы можете сделать это без понижения реакции-сценария, выполнив следующий процесс.

Вы можете изменить номер строки 62 из

node_modules / реагируют-DEV-Utils / webpackHotDevClient.js

из

 protocol:'ws', 

в

 protocol: window.location.protocol === 'https:' ? 'wss' : 'ws', 

То же самое происходит с облачной платформой Google (не удалось создать ‘WebSocket.). Вышеуказанная поправка будет работать и для этого, и я надеюсь, что и для AWS.

Если вы создаете свое приложение с помощью create-react-app , выполните следующие действия …

  • Windows 10
  • Версия узла 10.16.0

Откройте терминал в корневом каталоге вашего проекта и введите следующую команду. npm i express compression morgan --save
Нажмите Ввод

Создайте файл server.js в корневом каталоге вашего проекта и поместите в него следующий код.

 const {createServer} = require ('http'); const express = require('express'); const compression = require('compression'); const morgan = require ('morgan'); const path = require('path'); const normalizePort = port ={amp}gt; parseInt(port, 10); const app = express(); const PORT = normalizePort(process.env.PORT || 8000); const dev = app.get('env') !=  'production'; if(!dev){ app.disable('x-powered-by'); app.use(compression()); app.use(morgan('common')); app.use(express.static(path.join(__dirname,'build'))) app.get('/',(req,res)={amp}gt;{ res.sendFile(path.join(__dirname,'build','index.html')) }) } if(dev){ app.use(morgan('dev')) app.disable('x-powered-by'); app.use(compression()); app.use(morgan('common')); app.use(express.static(path.join(__dirname,'build'))) app.get('/',(req,res)={amp}gt;{ res.sendFile(path.join(__dirname,'build','index.html')) }) } const server = createServer(app); server.listen(PORT,err ={amp}gt;{ if(err) throw err; console.log('Server Started on port :'   PORT); }) с const {createServer} = require ('http'); const express = require('express'); const compression = require('compression'); const morgan = require ('morgan'); const path = require('path'); const normalizePort = port ={amp}gt; parseInt(port, 10); const app = express(); const PORT = normalizePort(process.env.PORT || 8000); const dev = app.get('env') !=  'production'; if(!dev){ app.disable('x-powered-by'); app.use(compression()); app.use(morgan('common')); app.use(express.static(path.join(__dirname,'build'))) app.get('/',(req,res)={amp}gt;{ res.sendFile(path.join(__dirname,'build','index.html')) }) } if(dev){ app.use(morgan('dev')) app.disable('x-powered-by'); app.use(compression()); app.use(morgan('common')); app.use(express.static(path.join(__dirname,'build'))) app.get('/',(req,res)={amp}gt;{ res.sendFile(path.join(__dirname,'build','index.html')) }) } const server = createServer(app); server.listen(PORT,err ={amp}gt;{ if(err) throw err; console.log('Server Started on port :'   PORT); }) с const {createServer} = require ('http'); const express = require('express'); const compression = require('compression'); const morgan = require ('morgan'); const path = require('path'); const normalizePort = port ={amp}gt; parseInt(port, 10); const app = express(); const PORT = normalizePort(process.env.PORT || 8000); const dev = app.get('env') !=  'production'; if(!dev){ app.disable('x-powered-by'); app.use(compression()); app.use(morgan('common')); app.use(express.static(path.join(__dirname,'build'))) app.get('/',(req,res)={amp}gt;{ res.sendFile(path.join(__dirname,'build','index.html')) }) } if(dev){ app.use(morgan('dev')) app.disable('x-powered-by'); app.use(compression()); app.use(morgan('common')); app.use(express.static(path.join(__dirname,'build'))) app.get('/',(req,res)={amp}gt;{ res.sendFile(path.join(__dirname,'build','index.html')) }) } const server = createServer(app); server.listen(PORT,err ={amp}gt;{ if(err) throw err; console.log('Server Started on port :'   PORT); }) 

и в вашем файле package.json измените стартовый скрипт следующим образом:
"start": "node server.js",

иди вперед и запусти свое приложение, используя npm start.

Вышеуказанное исправление создаст экспресс-приложение, которое по умолчанию защищено. Это запускает экспресс-приложение, в котором будет работать приложение реагирования.

Разверните его в Heroku.

Пример приложения, размещенного в heroku (React): ManoBran WebApp

Это должно помочь!