中间人使用vue-router加载＆＃39; Page Not Found＆＃39;在页面重新加载

Question

我正在构建一个在后端使用Middleman（Ruby）和在前端使用VueJS的网站，以及用于处理路由的vue-router。在我的vue-router索引中，我正在/ chapter /：id上加载视频组件，如下所示：

const routes = [
  {
    name: 'chapter',
    path: '/chapter/:id',
    component: Video,
    props: true
  },
]

当您点击<router-link>时，所有内容都按预期工作 - 但是当您重新加载页面时（例如：/ chapter / 2），它会加载“找不到文件”。来自米德尔曼。

Middleman中有什么东西可以禁用路由吗？

任何帮助将不胜感激！感谢

Answer 1

配置后端，以便在请求的地址为index.html时返回chapter/:id，或者，只要它不是后端api列表中的地址。

当我们使用使用vue构建的单页面应用时，我们总是在index.html，其中有一个app.js或者一直在运行的东西，当路由发生变化时，脚本会检测到并更改页面内容，但我们从未离开index.html。因此，当我们重新加载页面时，浏览器从服务器请求文档/ html，当html到达时，js脚本在其中，脚本运行，确定由于地址/路由而显示的内容，然后我们就开始了精细。

因此，在您的情况下，只需要修复“确保浏览器在访问/chapter/:id”部分时获取html文件。