Vue Router 在重新访问 url 时返回 404

Question

我只是启用了 Vue 路由器历史模式。当我通过 v-href 或 href 访问 vue 路由时，它工作正常。但是，当我尝试刷新该页面或直接从浏览器地址栏访问时，它只会返回 404。是否有任何选项可以接受刷新/重新访问该 url？

以下是我的Vue路由器配置

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

原文由 Set Kyar Wa Lar 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

通过刷新页面，您正在使用当前 url 向服务器发出请求，服务器返回 404。您必须在 Web 框架或 Web 服务器级别处理此问题。

本文包含示例服务器确认： https ://router.vuejs.org/guide/essentials/history-mode.html

原文由 zxzak 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

我认为您错过了 SPA 不是服务器端渲染。至少对大多数人来说。因此，当您访问 /anything 时，您的网络服务器不会将其重定向到 index.html。但是，如果您单击任何 vuejs 路由器链接，它将起作用，因为 javascript 起作用了，而不是服务器端。

要解决此问题，请使用 .htaccess 并将所有请求重定向到 index.html，如下所示

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

希望它可以帮助某人！

原文由 Tiago Matos 发布，翻译遵循 CC BY-SA 3.0 许可协议