Question

我在vue.js中使用vue-router。当我将其作为本地服务器运行时，它可以正常工作，但是一旦将其上传到我的网络服务器并直接进入页面，它就会导致“未找到”错误，

这在本地服务器上运行正常： http://192.168.2.118:8080/page2

产生

未找到。在此服务器上找不到请求的URL。

我已将模式设置为“历史记录”，以消除网址中的＃，但似乎与该地址无关。

与我的网络服务器有关吗？

这是我的router.js中的代码

export default new Router({
    mode: "history",
    base: process.env.BASE_URL,
    routes: [
        {
            path: "/",
            name: "page1",
            component: Page1
        },
        {
            path: "/page2",
            name: "page2",
            component: () =>
                import(/* webpackChunkName: "home" */ "./views/Page2.vue")
        }
    ]
});

这是项目的完整回购： https://github.com/reppoper/forumpost

解决方案：

我通过将.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>

Answer 1

由于您的应用是单页客户端应用，没有正确的服务器配置，因此如果用户直接在浏览器中访问http://yoursite.com/page2，则会收到404错误。

要解决此问题，您需要做的就是向服务器添加一条简单的“全部捕获”后备路由。如果该网址与任何静态资产都不匹配，则该网址应与您的应用程序所在的index.html页相同。

检查文档以在其他类型的服务器上解决此问题。 Docs

直接从vue.js中的网址加载页面时找不到网址

1 个答案: