46

Vue ルーターの履歴モードを有効にするだけです。そして、v-href または href を介して vue ルーティングにアクセスすると、正常に動作します。しかし、そのページを更新しようとしたり、ブラウザのアドレスバーから直接移動しようとすると、404 が返されます。その URL への更新/再アクセスを受け入れるオプションはありますか?

以下は私のVueルーター構成です

var router = new VueRouter({
  hashbang: false,
  history: true,
  mode: 'html5',
  linkActiveClass: "active",
  root:  '/user'
});
4

19 に答える 19

49

ページを更新すると、現在の URL でサーバーにリクエストが送信され、サーバーは 404 を返します。これは、Web フレームワークまたは Web サーバー レベルで処理する必要があります。

https://router.vuejs.org/en/essentials/history-mode.html

于 2016-04-04T10:04:08.897 に答える
9

これは単純すぎます。サーバーに次の構成を追加するだけです。

アパッチ

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

次に、 Nginxを使用している場合:

location / {
  try_files $uri $uri/ /index.html;
}

それだけです

詳細については、このリンクにアクセスしてください

于 2020-12-06T00:40:10.830 に答える
8

/etc/apache2/apache2.confApache 自体でさえ、そのような状況での使用を思いとどまらせるため、 root アクセス権がある場合は (Ubuntu で) を変更することをお勧めします。.htaccess

最初に、あなたがしなければならないことに注意してください

sudo a2enmod rewrite

次に、次のブロックを に追加します/etc/apache2/apache2.conf。

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

この後、

sudo systemctl restart apache2

/Vue によって作成されたルートを にリダイレクトするだけでなく、実際にウェブサイトを同じルートに更新するため、更新後も同じビューにとどまるため、私にとってはこれは問題なく機能します。

于 2020-02-04T15:13:42.177 に答える
6

アプリのバックエンドとして .NET Core でこの問題に対処している場合は、.NET Core アプリケーションの Startup.cs で単純なフォールバック ハンドラーを使用することをお勧めします。

public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
{
        ....Your configuration
      app.UseMvc(routes =>
      {
        routes.MapRoute(
                  name: "default",
                  template: "{controller=Home}/{action=Index}/{id?}");
      });
      //handle client side routes
      app.Run(async (context) =>
      {
        context.Response.ContentType = "text/html";
        await context.Response.SendFileAsync(Path.Combine(env.WebRootPath, "index.html"));
      });
    }
 }

詳細: http://blog.manuelmejiajr.com/2017/10/letting-net-core-handle-client-routes.html

于 2017-10-30T19:16:00.460 に答える
1

Netlify の場合、以下をpublic/_redirectsファイルに追加します...

/*    /index.html   200

https://www.netlify.com/docs/redirects/#history-pushstate-and-single-page-appsを参照してください

于 2019-10-13T23:06:19.510 に答える