Vue.js Vue-如何使用404响应代码创建404错误页面

如何在Vue中使用404响应代码创建404错误页？这是404的路线

{
    path: "*",
    name: "404",
    component: load("404"),
    alias: "/404"
  }

---

您将无法在单页应用程序中设置HTTP状态代码-所有路由都在浏览器的同一页上完成，因此一旦加载该页，将不会再收到HTTP状态代码

但是，如果您试图通过直接在浏览器的地址栏中键入/复制URL来加载不存在的路由，那么您可以使用nginX（或您正在使用的任何服务器软件）向404 HTTP状态发送信号：

server {
  error_page 404 /404.html;

  location / {
    try_files $uri $uri/ =404;
  }
}

但这不是一种实用/明智的方法-基本上，您希望将每个不存在的路径解析为

/index.html

，以便始终加载SPA，一旦加载，它将检测到此路由不存在，并呈现404组件

因此，您的nginX配置应该如下所示：

server {
  ...

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

---

$is_args

变量将添加

？

如果

$args

不为空，而

$args

将提供查询参数（如果有）。

您的路由定义看起来不错，只是我不知道您的

加载

函数是如何执行的，即它是如何解析为Vue组件的。但一般来说，您的代码遵循中描述的通用方法。通常，此处不需要

名称

或

别名

，因为此路由没有明确使用。只需添加一个显示“未找到”内容的组件，您就可以开始了：

{
  path: "*",
  component: PageNotFound
}

由于这与您提供的代码非常接近，请解释到底是什么给您带来了问题