Kann nicht Seite auf Aktualisieren Zugriff aufgrund Hasbangs in einer Reaktion SPA

Question

Ich bin ein ReactJS SPA von https://github.com/facebookincubator/create-react-app erstellt mit

I S3 und Cloudfront bin mit meiner Website zu dienen. Alles funktioniert gut, bis ich die Seite neu lade - es löst einen Fehler aus (Zugriff verweigert in meinem Fall), da es ohne den Hashbang nicht möglich ist.

Hinweis: Es funktioniert gut, wenn ich die URL mit einem Hash-Bang

So im Wesentlichen geben, dies funktioniert: https://example.com/#/dashboard (Umleitungen zu https://example.com/dashboard)

Aber wenn ich die Seite aktualisiert, gibt es einen Fehler wie:

Wir verwenden browserHistory die Routen zu halten. Ich bin mit dem zugehörigen Code zeigt nur:

<Router history={browserHistory}> 
<Route path='/dashboard' component={Dashboardpage} /> 
</Router> 

Answer 1

Wenn Sie https://example.com/dashboard anfordern, die erste Anforderung dh https://example.com auf dem Server vorgenommen, und es sollte die index.html zurück, die Ihre reagieren-Router enthält, die intelligent genug ist um den Pfad zu verstehen dh ohne die Hashbangs und lädt die benötigte Komponente. So müssen einige Umleitungsrouten auf Serverseite eingerichtet werden.

In Ihrem Fall, wenn Sie die https://example.com/dashboard treffen, sollte S3 und Cloudfront die Fehlercodes (d. H. 404 oder beliebige) behandeln und die Seite zu index.html umleiten, danach wird der react-Router behandeln, welche Komponente geladen werden soll.

hoffe, meine Antwort ist klar;)

Sie auch auf die Antwort hier gegebenen beziehen React-router urls don't work when refreshing or writting manually