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

标签 javascript vue.js vuejs2 vue-router nuxt.js

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

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

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

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

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

我读过有关 nuxt generate 生成预呈现页面的信息,但是在处理数百条记录时使用它是否好用?

如有任何帮助、建议,我们将不胜感激。

谢谢

最佳答案

一开始你应该明白什么问题可以帮助你解决nuxt。

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

  1. 静态页面

nuxt在路由的基础上生成html文件,有利于SEO。例如,这适用于名片页面(主页 + 几个子页面)。你得到现成的 html 文件,例如index.html、contact.html 等

  1. SPA

不需要搜索引擎优化但具有动态路径和界面的应用程序。不使用服务器端渲染。有些方法无法使用,但还是利用了nuxt的一些好处。例如,动态路由或 nuxt 中配置中可用的许多选项。

  1. 通用

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

因此,如果需要使用动态路由,就不得不在SPA和Universal模式之间做出选择。检查您应该执行哪些命令 USE

关于javascript - 页面重新加载后Nuxt动态路由返回404,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54887555/

相关文章:

javascript - AngularJS - 动态添加模板并调用相应的 Controller

javascript - 用多个 DIV 填充屏幕

vue.js - 我可以访问本地系统环境吗?使用 vue-cli 时的变量?

vue.js - 单击按钮在文本框中添加占位符

javascript - Raphael JS 选择路径/对象/节点的特定实例

javascript - 在网页中嵌入音频的最佳方式?

javascript - firebase 未定义 Vue.js

vue.js - 如何使用 Nuxt.js 仅在一个组件中使用插件?

javascript - 作为 Vue 插件的一部分将 Mutations 添加到 Vuex store

jquery - 当Jquery更改文本输入时,Vuejs如何强制v-model更新?