Как использовать реагирующий маршрут на героку?

Question

У меня есть простое веб-приложение, созданное с помощью create-реакции-приложения.

Все страницы с маркой реакции работают нормально в локальной сети.

class App extends React.Component{


    render(){
        return (
            <Router>
                <div>
                    <Menu/>
                    <div className="page-content">
                    <Route exact path="/" component={Hello}/>
                    <Route exact path="/signup" component={Register}/>

                    </div>
                </div>

            </Router>
        );
    }
}

ЗдесьРазорвите код:

// setting application
app.use(cors());
app.use(express.json());
app.use(express.static(path.join(__dirname, 'client/build')));

и

app.get('/', (req, res) => {
    res.sendFile(path.resolve(__dirname + '/client/build/index.html'))
  })

Но когда я развернул на Heroku, это не сработало.Когда я нажимаю на ссылки, отображается сообщение Cannot GET /signup.

Answer 1

Вы можете проверить это учебное пособие .

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

Так что же такое решение?Для каждого запроса в веб-интерфейсе вы должны возвращать index.html и оставлять для реагирования маршрутизатор, выполняющий маршрутизацию.

В руководстве, которое настроено с помощью этого кода:

app.get('/*', function (req, res) {
  res.sendFile(path.join(__dirname, 'build', 'index.html'));
});

Вам следует изменитькод выглядит так:

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