Приложение React на производстве - ссылки не работают при прямом запросе, они работают только при доступе к реагирующему маршрутизатору - PullRequest
0 голосов
/ 03 августа 2020

Я развернул приложение на сервере ubuntu. Я запустил npm run build и скопировал все содержимое сборки в / var / www/html Файл / etc / nginx / sites-available / default выглядит так (значение по умолчанию):

server {
    listen 80 default_server;
    listen [::]:80 default_server;
    root /var/www/html;
    index index.html;
    server_name _;
    location / {
            try_files $uri $uri/ =404;
    }
}

При попытке получить доступ к 111.111.11.11/contact-us напрямую через браузер я получаю 404. Что мне не хватает? почему приложение реагирования не обрабатывает этот запрос?

Вот код:

История. js:

import { createBrowserHistory } from 'history';
export default createBrowserHistory();

Приложение. js:

import { Router, Route, Switch } from "react-router-dom";
render() {
        return (
          <div className="page">
            <Router history={history}>
            <Header />
              <Switch>
                <Route path="/combination/:uniqueUrl" exact component={CombinationPage} />
                <Route path="/" exact component={MainContent} />
                <Route path="/contact-us" exact component={ContactUs} />
                <Route path="*" exact component={PageNotFound} />
              </Switch>
            </Router>
          </div>
        )
      }

Важное обновление : если я добавлю / # / , он заработает, и я смогу получить доступ к странице. Например, http://111.111.11.11/# / contact-us .

Важная информация: Локально он работает правильно при использовании "npm run start" проблема в том, что он находится на сервере ubuntu, после запуска npm run build.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...