VUEは、問題の歴史リフレッシュモード404のソリューションをルーティング反応します

VUE単一ページのマイクロチャネルの共有や自動URLアドレスで「#」のために必要なサインインのため、より多くのピットを処理し、存在しています。この問題は、履歴モードでは存在しないでしょう。しかし、履歴モードに、新たな問題があるだろう、それはページが更新した後、ページが(404)を表示することができない、です。この問題については、我々は唯一のURLは任意の静的リソースに一致する場合に、デフォルトのindex.htmlにジャンプし、サーバを設定する必要があります。
私がここに持っているように要約nginxのための設定は、次のされています
(この方法でハイジャックされる可能性が高い第三者)オプション1を

1つの場所/ {
 2          ルート/データ/ nginxの/ HTML。
3          インデックスのindex.htmlのindex.htm。
4          error_page 404 / index.htmlを。
5 }

オプションII

。1つの      LOCATION / {
 2          ルート/ XXX / distの;
 3。         インデックスのindex.html index.htmを、
 4。         IF - (!{$ REQUEST_FILENAME E)
 5。              リライト^ / /(*。)Index.htmlと最終; //     /index.htmlがスペースの前に
 6。             BREAK ;
 7          }
 。8      }

オプション3 vue.js公式チュートリアルが言及したhttps://router.vuejs.org/zh-cn/essentials/history-mode.html

1台の   サーバー{
 2          8888聞く、使用されていないポートを変更できない場合は#80がデフォルトのポートである
 3。         サーバー名localhostは、
 4          ルート/ XXX / DIST; DISTパケット#vue項目
 5          LOCATION / {
 6              try_files $ $ URI URI / @router; nginxの404現れるVUE更新され#@routerそうでなければ、以下の経路を指すために必要
 7。             インデックスのindex.htmlのindex.htmを、
 8          }
 9。         リソースに主として上記@routerに対応#、パスルーティングとではない真のパス、私は特定のファイルを見つけることができません
 10          #をそのためのindex.htmlを書き換えるために、その後、要求ルーティングリソースを処理する必要がある
 11          LOCATIONの@router {
 12              ^書き換えを。* $ /最後のindex.html、    フロントスペース行う/index.html
 13          }
 14          位.......他の部分は省略する
 15    }

詳細な構成:

try_filesは、ユーザーがURLリソースの要求したときにことを意味 www.xxx.com/xxxを 、try_filesリソースがXXXを見つけるために、ハードディスクのルートディレクトリに移動します。その後、xxxは、探しているという名前のディレクトリに見つからない場合は、xxxのリターンを命名し、ファイルの存在が@routerを実行するための意志を見つけることができない場合。($ウリは、$ URI /ディレクトリには、指を見つけ、ファイルを見つけるために参照します)

nginxの書き換えリダイレクト命令です。^。* $リダイレクトルール。/index.htmlがリダイレクトパス。

 

おすすめ

転載: www.cnblogs.com/wang-yaz/p/11224019.html