2016-10-30 9 views
1

私は自分の開発サーバーにデプロイできるReactアプリケーションを構築しました。私は今それをリモートサーバにアップロードしたいが、これは私が問題に遭遇するところである。リアルータの 'browserHistory'をライブサーバで有効にする

私はこのことについて少し読んだことがあります。私はこの用語を少し高密度で侵入不可能なものにしていますので、誰かが私のために綴るのを助けることができたら本当に感謝します。

私が理解する限り、hashHistoryを使用している場合、あなたは「醜い」URLを持っていますが、ライブサーバーに展開できるという利点があります。

これに対して、browserHistory(私の場合)を使用すると、「きれいな」URLが得られますが、サーバにアップロードするとき、特にネストしたURLでページを更新するときに問題が発生します。この - react-routerは必要な場所でコンポーネントをロードするための正しいjavascriptを生成するために使用される偽URLを作成しています。

これほど多くのことを私は理解しています(または私には表示されない場合は修正してください)。

サーバサイドのJSに頭を先に置くことなく、この問題を解決する方法を知りたい特定のに問題があります。

私はHerokuについて読んだことがありますが、インストール後には、すべてを起動して実行する方法について多くのガイダンスがないようです。私はserver.jsファイルを含むエクスプレスサーバーにアプリケーションをフックするconfigsを見てきましたが、これも少し失われます。

誰かが正しい方向に私を指すことができたら本当に感謝します、これは私にとってまったく新しい領域です!用語の解説とできるだけ詳しく説明していただきたいと思います。

ありがとうございます。

答えて

2

警告:ちょっとしたレベルの答えです。自己責任でお読みください。

[いいえ] 1つのことを信じて始めましょう。 Every Web App Serve By Server;

今、どのように動作していますか?

ケース1:あなたがhttp://mart71.com/index.htmlまたはhttp://mart71.comとしてURLでファイルを要求し、それはあなたを提供index.html

ケース2:あなたhttp://mart71.com/products/2の要求とその応答製品ページ(動的)とそのIDとして:2

いいえ..今すぐどうすればSingle Page Applicationは機能しますか? SPAの場合

、あなたのすべての要求はとてもindex.html によって処理されなければならない、あなたはhttp://mart71.comを要求、サーバーの役割を果たすすべてのjavascriptファイルやJavascriptの実行に「index.htmlを」と上に表示する必要があるかを示します貸出ページ。あなたはそのすべてのjavascriptJavascript実行とproducts/2にプッシュブラウザの履歴の状態(URL変更)と表示ページとhttp://mart71.com/products/2、最初にその負荷index.htmlとして別のURIを要求

。この場合、サーバーは実際にそのページに何が表示されているのか分かりません。

どういう意味ですか?

Simply, setup your server to serve all request by `index.html` 

それをどのように行うには?

nginxの:.htaccessの上または

RewriteCond %{REQUEST_FILENAME} !-f 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteRule . /index.html [L] 

のNode.js express.js

don't try this at production.. considered as bad practice. Use Nginx or Apache as proxy server. 
の.conf:nginx.conf

location/{ 
    try_files $uri /index.html =404; // means what ever the url is, serve index.html 
} 

Apacheの上

+0

そのような完璧な答え!ありがとう、私は初心者の初心者からのこのソリューションは完璧だったので、私は初心者です! – Noitidart

関連する問題