私の反応アプリケーションはlocalhostで正常に動作していますが、gh-pagesまたはサージにデプロイした後、URLを使用してページ間を移動できません。
ユーザーは右上隅のmenuItemをクリックしてサインアップページに移動できます。しかし、ユーザーが http://chat.susi.ai/signup/ URLを使用すると、404ページが表示されます
インターネットからいくつかの解決策を試しましたが、うまくいきませんでした。
次の質問は次のとおりです。ユーザーが壊れたリンクに移動しようとしたときに表示される404ページを作成しました。これはlocalhostで正常に動作します。しかし、生産されていません。私は this ソリューションを試しましたが、何も変わりませんでした。
これは私のindex.jsファイルの一部です
const App = () => (
<Router history={hashHistory}>
<MuiThemeProvider>
<Switch>
<Route exact path="/" component={ChatApp} />
<Route exact path="/signup" component={SignUp} />
<Route exact path="/logout" component={Logout} />
<Route exact path="/forgotpwd" component={ForgotPassword} />
<Route exact path="*" component={NotFound} />
</Switch>
</MuiThemeProvider>
</Router>
);
ReactDOM.render(
<App />,
document.getElementById('root')
);
誰かが私の問題のサンプルコードを使って良い解決策を提案できたら、それは私にとって本当に役立つでしょう。
これは、ユーザーがそれらのURLに直接アクセスしたときにアプリをブートストラップするindex.html
が提供されないために発生します。
急増する場合は、 追加する200.html
ファイル に、展開するindex.html
と同じ内容を含む(または単に200.html
に名前を変更する)-これを追加します。静的ファイルに対応していないユーザーがアクセスしたURLでユーザーに配信され、アプリの実行が開始されます。
編集:create-react-app
を使用しているようです。これは、create-react-app
のreact-scripts
パッケージがこれらのリクエストのフォールバックとしてindex.html
を処理するため、ローカルで開発しているときに機能します。
react-scripts
ユーザーガイド には、 GitHubページへのデプロイ時にこれを処理する方法 および surge.sh (上記)に関するセクションがあります。
変更.htaccess
ファイルをビルドフォルダー内のWebサーバーとしてApache
として使用した場合、私にとってはうまくいきました:
Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]
私も同じ問題を抱えていました。そして、私はそれを非常に簡単に解決しました... :)
フロントエンド(Create-React-App)とエクスプレスバックエンドでreactを使用しました。開発モードではすべてがうまく機能しますが、プロダクションビルドに切り替えたとき、反応ルーティングにいくつかのルーティング問題がありました。長い調査の後、問題はindex.htmlファイルを提供するサーバー側にあることがわかりました。
すべてのサーバー側ルーティングの後、すべてのapp.postハンドラの前にある必要があります。つまり、次の行は、すべてのapp.gets
の後、すべてのapp.posts
の前に配置する必要があります。
// PRODUCTION
App.get('*', (req, res)=>{
res.sendFile(path.resolve(where, the, index.html, is))
})