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

Question

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

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

Answer 1

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

但是，如果您尝试通过直接在浏览器的地址栏中键入/复制URL来加载不存在的路由，则可以使用nginX（或您使用的任何服务器软件）来表示404 HTTP状态：] >

server {
  error_page 404 /404.html;

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

Answer 2

您的路线定义看起来不错，除了我不知道您的load函数可以，即它如何解析为Vue组件。但是总的来说，您的代码遵循Vue router docs中描述的通用方法。通常，在这里您不需要name或alias，因为未明确使用此路由。只需放入一个显示“未找到”内容的组件，就可以了：