vue代理请求Request failed with status code 404

将你安装的proxy 或者是 createProxyMiddleware重新安装一遍 可能是因为 版本过低的原因重新 npm

npm install --save-dev proxy
npm install --save-dev http-proxy-middleware

Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500

前后端分离，写axios时常见报错

常见问题-跨域（要配置一下vue.config.js）噢

跨域的解释、定义：当前所在页面的url去请求后台提供的url的时候，这两个url的相比较之下，如果协议类型、域名、端口号其中任何一个不一致就会发生跨域问题

1.404

在这里插入图片描述

  • 可能是后端的bug，还没部署好(接口未处理)之类的
  • 可能是前端问题：路径错误（拼写错误！！！）
  • 跨域问题-路径没写对

这是我main.js的配置（个人习惯不一样，可能不同噢）

在这里插入图片描述

这是vue里面的写法，需要注意记着写写’${}‘否则跨域代理不会成功

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-W2aMBUJF-1636893445917)(Vue-cli%E7%AC%94%E8%AE%B0%E4%BB%8E%E5%AE%89%E8%A3%85%E5%88%B0%E5%9F%BA%E7%A1%80%E5%85%A5%E9%97%A8.assets/image-20211114202746380.png)]

然后如果是js里面就直接写名字，不用写${}

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-U3wZhz8V-1636893445920)(Vue-cli%E7%AC%94%E8%AE%B0%E4%BB%8E%E5%AE%89%E8%A3%85%E5%88%B0%E5%9F%BA%E7%A1%80%E5%85%A5%E9%97%A8.assets/image-20211114203633045.png)]

2.500

请求成功后的500

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-yABhwcJi-1636893445923)(Vue-cli笔记从安装到基础入门.assets/image-20211104133822333.png)]

问题：后端服务器没开？------我记得似乎是欸

3.拦截器有误Cannot read propertiesding ‘cancelToken’

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-l9cP6Vbj-1636893445930)(Vue-cli笔记从安装到基础入门.assets/image-20211104171011053.png)]

是因为在添加请求拦截器的时候，最后没有添加返回值return config方法正确的写法应该是：

axios.interceptors.request.use((config)=>{undefined
if(getStore(‘token')){undefined
config.headers.Authorization=getStore(‘token');
}
return config;
},(error)=>{undefined
console.log(error);
});

建议

  • 可能是后端的日常小bug，还没部署好之类的，我们就等等，多问问，多和后端哥哥姐姐交流交流。呜呜呜,不要闷头一个人肝代码，写不出来、还是错的、五个小时过去了、进度为0、会怀疑人生的
  • 也可能是请求头的问题（数据拼接在url里面or单独传输）
  • 可能是后端要求的数据不一致和发送的数据不一致(看看前后端接口，是否数据命名一致)

尝试解决

这是一种解决方式：先网址访问，看看后端是否有数据返回（看看是否部署好之类的）

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ElXxtseG-1636893445933)(Vue-cli笔记从安装到基础入门.assets/image-20211104134404739.png)]

总结