私は非常に興味深い問題に遭遇しました。 My React JSルートファイルには複数のルータがあります。ReactJSルータがExpressJSルータをオーバーライドしています
render() {
return (
<div className="container body">
<Route exact path="/" component={<IndexPage/>} />
<Route exact path="/users" component={<Users/>} />
<Route exact path="https://stackoverflow.com/users/:userId" component={<User/> }/>
<Route exact path="/routers" component={<Routers/>} />
</div>
);
}
ルートに応じてコンポーネントを生成します。それから私は、webpackで単一のjavascriptファイルとして反応コンポーネントをビルドしました。
const express = require('express');
const app = express();
// This is location where generated Webpack files are located
app.use(express.static(__dirname + '/../build'));
app.get('/api/hello', (req, res) => {
res.json({hello: 'world'})
});
// This is how I render React based pages
app.get(['/', '/users', '/routers'], (req, res) => {
res.sendFile(__dirname + '/../build/index.html');
});
app.listen(9000);
私は私のブラウザで/
、/users
、/routers
パスを開くと、それは正しいがコンポーネントに反応を示しています。
今、私はこのようなExpressJS経由ページに反応を示すためにしようとしています。
しかし、私は/api/hello
を開こうとすると、JSON応答を表示するのではなく、存在しない反応コンポーネントを生成しようとしています!
ReactのルーターがExpressのルーターをオーバーライドするのを止めるには?
================= UPDATE =====================
I興味深い解決策を見つけました。私がapi/hello
リクエストしたときPOSTMANそれは私にJSONの応答を示しています。
これは、ReactJSがブラウザレベルで独自のCACHINGを持っていることを意味します。これは、経路を上書きするように見えます。