针对vue-cli axios请求跨域问题,qs用法

在使用vue-cli脚手架开发时搭配webpack,并使用axios进行请求时,有时可能遇到跨域问题如下图:

针对vue-cli axios请求跨域问题,qs用法

首先找到config/index.js 的dev中的配置如下

针对vue-cli axios请求跨域问题,qs用法

在maxin.js中将axios注入到vue中

针对vue-cli axios请求跨域问题,qs用法

在页面中进行请求

针对vue-cli axios请求跨域问题,qs用法

你会发现请求成功了

针对vue-cli axios请求跨域问题,qs用法

但是err确实100

这时候就提到qs安全,先npm install qs --save-dev

针对vue-cli axios请求跨域问题,qs用法

可以理解为qs 类似于JSON.stringify转换格式的一种方法

这时候问题来了 我们在项目中会有好多组件,那么我每个组件中都去引入一个qs很麻烦 

个人解决办法 我换了一种注入方式

针对vue-cli axios请求跨域问题,qs用法

将这个页面注入到vue中,这样在我们调用this.$http时 就可以免去引用qs 跟使用qs.stringify方法了