NodeJS и реагирование развертывания приложения на AWS: не рендерится реагирующий интерфейс - PullRequest
0 голосов
/ 20 апреля 2020

Я развернул приложение nodejs и реагировал на AWS EC2, следуя этому руководству . Я вижу заголовок stati c html, но реагирующие представления не отображаются. Глядя на вкладку «Сеть», я вижу около 404 для запроса на получение, но я не уверен, где проблема.

Вот мой nginx setup:

server {
    listen 80;
    location / {
        proxy_pass http://{{my ec2 ip}}:{{5000}};
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

package. json для клиента:

{
  "name": "client",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    some dependencies
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "homepage": "http://{{my ec2 ip}}",
  "proxy": "http://{{my ec2 ip}}:5000",
  "browserslist": {
    "production": [
      ">0.2%",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Наконец, для быстрой проверки работоспособности, вот мой сервер. js и структура каталогов:

var express = require("express")
var cors = require("cors")
var path = require("path")
var bodyParser = require("body-parser")
var app = express()
var port = process.env.PORT || 5000

var Users = require('./routes/Users')

app.use(express.json());
app.use(express.urlencoded({ extended: false }));

app.use(Users)

app.use(express.static(path.resolve(__dirname, './client/build')));



app.get('*',function(req,res){
  res.sendFile(path.resolve(__dirname, 'client', 'build'));
});

app.listen(port, () => {
    console.log("Server is running on port: " + port)
})

Заранее спасибо!

обновление

Вот подробное описание ошибки 404: я получил ошибку в консоли:

Ресурс из «http://34.203.226.71/ec2-34-203-226-71.compute-1.amazonaws.com/static/js/main.2b162001.js ”было заблокировано из-за несоответствия типа MIME (« text / html ») (X-Content-Type-Options: nosniff)"

И на вкладке сети запросы get / возвращают 404 enter image description here

обновление Вот мой индекс. js файл:

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

ReactDOM.render(<App />, document.getElementById('root'));
registerServiceWorker();

В моем приложении. js он просто содержит список маршрутов, соответствующих разным компонентам.

1 Ответ

1 голос
/ 21 апреля 2020

Это может быть связано с тем, что server.js загружается до того, как реакция закончит строительство. Таким образом, путь stati c указывает на ./client/build, который еще не существует. Поэтому, возможно, запустите server.js после того, как реакция завершит процесс сборки.

...