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

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

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

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

1. 404

Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500_第1张图片

  • 可能是后端的bug,还没部署好(接口未处理)之类的

  • 可能是前端问题:路径错误(拼写错误!!!)

  • 跨域问题-路径没写对

    这是我main.js的配置(个人习惯不一样,可能不同噢)

    Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500_第2张图片

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

    Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500_第3张图片

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

    Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500_第4张图片

2. 500

请求成功后的500

Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500_第5张图片
问题:后端服务器没开?------我记得似乎是欸

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

Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500_第6张图片

是因为在添加请求拦截器的时候,最后没有添加返回值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单独传输)

  • 可能是后端要求的数据不一致和发送的数据不一致(看看前后端接口,是否数据命名一致)

尝试解决: 这是一种解决方式:先网址访问,看看后端是否有数据返回(看看是否部署好之类的)

Error: Request failed with status code 404 at createError (createError、跨域问题、axios、404、500_第7张图片

你可能感兴趣的:(vue-cli问题记录,vue.js,前端,javascript)