リアクタ `browserHistory`：サーバ上でレンダリングする必要がありますか？

Question

私はReactを初めて使用し、ルーティングの仕組みを学ぶだけです。 hashHistory（/#/paths/like/this）は素晴らしいですが、browserHistory（/paths/like/this）の方がはるかによく見えます。明らかに、browserHistoryのURLは、ブラウザーが存在しない/path/on/serverを要求するため、URLを再度開いたときにすぐに使用できなくなります。

/nice/pathsを使用してユーザーがページを直接開いたり、Ctrl + Rページを表示したり、その場所、またはそこに留まることができるようにするには、サーバー側のレンダリング（いわゆるisomorphic rendering）を使用する必要がありますかclient-sideのままにしておくことができますか？

ありがとうございました。

Answer 1

いいえclient-sideのレンダリングを簡単に使用できます。また、ユーザーにnice/paths/のようなパスを使用させることはできません。

これらのルートはReactの便利さに過ぎず、サーバーには存在しないため、ページが存在しないためエラーになります。これを解決するには、サーバー内のすべてのルートをindex.html（アプリケーションのエントリポイント）に指定し、Reactに引き継ぎ、パスを処理させる必要があります。エクスプレスで

それはこのように行われます：Apacheサーバの場合

app.get('*', function(req, res) { 
    res.sendFile(__dirname + '/public/index.html') 
}) 

これは.htaccess次のようになります。

彼らは自分の方法と、このポインティングを持っている他のサーバサイド言語の

<IfModule mod_rewrite.c> 
    RewriteEngine On 
    RewriteBase/
    RewriteRule ^index\.html$ - [L] 
    RewriteCond %{REQUEST_FILENAME} !-f 
    RewriteCond %{REQUEST_FILENAME} !-d 
    RewriteRule . /index.html [L] 
</IfModule> 

index.htmlは、基本的に論理が同じであるため、AngularなどのすべてのSPAフレームワークで機能します。

Answer 2

Mrinalmechは、私はちょうどnginxのための設定の例を追加したい、正しい答えを与えた：

server { 

    server_name yourHostName.com; 
    listen 80; 

    root /path/to/app/folder; 
    index index.html; 

    location ~ ^[a-zA-Z0-9/_-]+$ { 
     rewrite (.*) /index.html last; 
    } 
}