时间戳

首页 > 解决方案 > 页面重新加载后 Nuxt 动态路由返回 404

javascript - 页面重新加载后 Nuxt 动态路由返回 404

问题描述

大家好，我正在做一个使用 nuxt js 的项目，我只是这个框架的新手。我已将其配置为使用spa模式，仅供参考，我没有在我的 nuxt 配置中更改或添加任何内容，只是默认设置。以下是我设置页面的方式。

pages/users/index.vue - 显示列表或用户

pages/users/_id.vue - 显示特定用户

我已经使用npm run build和npm run start命令部署了我的项目。然后 dist 目录托管在 nginx 服务器中。

问题是，当我使用 nuxt 链接导航到/user/id时，页面会正确呈现，但是当我直接访问页面 url 或刷新页面时，我得到 nginx 404 页面未找到。

我已经阅读了有关 nuxt generate 来生成预渲染页面的信息，但是在处理数百条记录时是否可以使用它？

任何帮助，建议，将不胜感激。

谢谢

标签： javascriptvue.jsvuejs2vue-routernuxt.js

解决方案

一开始您应该了解哪些问题可以帮助您解决 nuxt。

您可以创建三种类型的应用程序：

  1. 静态页面

在路由的基础上，nuxt 生成 html 文件，这些文件是 SEO 友好的。例如，这适用于名片页面（主页 + 几个子页面）。您将获得现成的 html 文件，例如 index.html、contact.html 等。

  1. 温泉

不需要 SEO，但具有动态路径和界面的应用程序。不使用服务器端渲染。有些方法不可用，但仍然使用 nuxt 的一些好处。例如，动态路由或 nuxt 中配置中可用的许多选项。

  1. 普遍的

让您享受 nuxt.js 的所有好处。在专用网站方法（fetch、asyncData、nuxtServerInit 等）的帮助下，它允许您在服务器端准备数据以在浏览器端生成它们，以便它们对 SEO 友好。

因此，如果需要使用动态路由，则必须在 SPA 和 Universal 模式之间进行选择。检查您应该使用哪些命令

推荐阅读