› NGINX
› NGINX Trac
› 3rd Party Modules
› Security Advisories
› CHANGES
› OpenResty
› ngx_lua
› Tengine
在线学习资源
› NGINX 开发从入门到精通
NGINX Modules
› ngx_echo
这是一个创建于 2539 天前的主题，其中的信息可能已经有所发展或是发生改变。
我在一个 Vue 项目中构建了一个错误页面，它的效果类似于访问 http://server_name/error/500 会让 vue-router 将 router-view 的内容变更为「服务器内部错误」的这种错误提示。
现在需要将这个项目部署到服务器上，问题来了：如何让 Nginx 跳转到这个错误页面上来呢（保证浏览器中 URL 不变）？查了一些资料，试了下 rewrite，但是由于这个错误页面并不是静态的，所以没有办法通过 rewrite 来实现。
第 1 条附言 · 2019 年 1 月 30 日
这个问题异常复杂的关键在于 vue-router 会修改 URL，所以常规方法都不太行…
 |
1
qyxx 2019 年 1 月 30 日
error_page 404 /404.html;
|
 |
2
oott123 2019 年 1 月 30 日 via Android  1
没办法，自己编译一个单独的静态页放着
|
 |
5
vsomeone OP @qyxx 抱歉，可能是我没表述清楚，我的这个错误页面是通过一个 Vue component 实现的，这个 component 内显示的内容是根据 url 变化的 (vue-router 中体现为 /error/:code)，不是一个静态的页面。
|
 |
7
keepeye 2019 年 1 月 30 日
很奇怪为什么要通过 nginx ？ spa 你不是去请求后端接口吗？根据返回的错误码显示你那个 component 就是了吧
|
|
8
vsomeone OP @Outshine 可以倒是可以，但是用户体验不太好，因为浏览器 URL 变成了 /error/:code，刷新还会是显示错误页面，而不会是重新尝试 request
|
 |
10
mgso 2019 年 1 月 30 日 via iPhone
@keepeye 正解！既然是一个 component 也有路由，捕获到了错误后直接跳转到对应的理由上。在什么 axios 里做一个全局响应拦截，判断出错了就直接 router.push 到 500 或者其他什么错误页面
|
|
11
mgso 2019 年 1 月 30 日 via iPhone
@vsomeone 那么可以在 app.vue 里 隐藏一个错误提示的 div 区域。如果出现错误了 router-view 里的内容隐藏，同时显示这个 div 区域的内容
|
 |
15
binaryify 2019 年 1 月 30 日
nginx 返回 index.html/500 就行了吧,前端路由再写个 500 的页面
|
Select Language