昨天发起http请求一个接口,请求的返回值竟然是
We're sorry but XXX doesn't work properly without JavaScript enabled. Please enable it to continue.
如果项目是vue-cli创建的,搜索全局就会发现
index.html
中有一句一模一样的话。
这就简单了,
说明请求返回了index页面
为什么会这样呢?
答案非常明显,是server配置不对,没有匹配到要请求的路径。如果是开发阶段(运行npm run serve)检查一下代理devServer.proxy ,如果是在测试环境或者生产环境,检查nginx,或者Apache等server。
举个例子,以nginx配置为例
例如http请求的路径是 /login,首先检查nginx.conf文件中的location,是否配置了/login的转发。如果配置了,检查是否配错了,多个“/”少个”/”都可能导致正则匹配不到
参考我的配置
server{
listen 8081;
server_name localhost;
location ~^/(oauth|login|user|api) {
proxy_http_version 1.1;
proxy_pass http://xxxxxx:8080;
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Methods
"POST, GET, DELETE, OPTIONS"
;
add_header Access-Control-Allow-Headers
"Origin, Authorization, Accept"
;
add_header Access-Control-Allow-Credentials
true
;
location / {
root /usr/dev/project/fe/test;
try_files
$uri
$uri
/ /index.html;
另外,我看到一些其他网站说是history问题,(因为我项目创建就已经配好了try_files,没有遇到因为history导致报错):
如果vue的路由是history模式,需要在location里面加上这句
location / {
try_files $uri $uri/ /index.html;
这句话的意思是
从root的路径开始作为起始路径,找到第一个index.html作为初始化页面,如果找不到,就往下一级目录找.**