Create-React-App в производстве: маршруты не найдены - PullRequest
0 голосов
/ 24 августа 2018

У меня полнофункциональное приложение с бэкэндом Create-React-App и Express.js.

Настройка разработки (CRA работает на порте 3000) осуществляется прокси-серверами CRA, поэтому я могу перенаправить определенные маршруты непосредственно на сервер (работает на порту 5000):

"proxy": {
    "/auth/*": {
      "target": "http://localhost:5000"
    },
    "/api/*": {
      "target": "http://localhost:5000"
    }
}

Для выхода из системы у меня есть соответствующий маршрут:

app.get('/api/logout', (req, res) => {
    req.logout();
    res.redirect('/');
});

И кнопка выхода из системы, которая указывает на этот маршрут:

<a key="logout" href="/api/logout">Logout</a>

В режиме разработки , работает: 3000 и: 5000, все работает отлично. Нажатие на кнопку устанавливает URL-адрес в браузере, который вызывает маршрут, прокси-сервер пересылается, а бэкэнд распознает и обрабатывает запрос правильно => Сеанс прерван!

В производственном режиме , размещенном на Heroku, маршрут просто не найден и не запущен. На вкладке сети сервер обслуживает статический HTML-файл, возможно, из-за этой конфигурации:

if (process.env.NODE_ENV === 'production') {

    app.use(express.static('client/build'));

    const path = require('path');
    app.get('*', (req, res) => {
        res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
    });
}

Если я выхожу из системы пользователя программно , вызывая тот же маршрут onClick, он работает:

await axios.get('/api/logout');

Но почему простое перенаправление браузера с <a> не работает на производстве?

THX!

1 Ответ

0 голосов
/ 05 сентября 2018

Изменить

if (process.env.NODE_ENV === 'production') {

app.use(express.static('client/build'));

const path = require('path');
app.get('*', (req, res) => {
    res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
});
}

На это:

let root = path.join(__dirname, 'client', 'build');
app.use(express.static(root));
app.use(function(req, res, next) {
if (req.method === 'GET' && req.accepts('html') && !req.is('json') && 
  !req.path.includes('.')) {
     res.sendFile('index.html', { root });
  } else next();
});

Может быть, это поможет: Настройка производственной среды в приложении create-реагировать

...