vue axios前端配合后端解决跨域问题，并将请求放在body中

vue axios请求跨域，网上资料一堆，有的用qs，还要在config文件夹下的index.js中修改proxyTable。如果后端配合的话，前端只需要做一些小修改，就能轻松实现跨域。

携带cookie 在axios创建时要加入withCredentials: true，默认withCredentials：false，是不会携带cookie的

axios.create({
  baseURL: '//ott-mng.jd.com/', // api 的 base_url
  timeout: 5000, // request timeout
  withCredentials: true
})

跨域需要携带两个参数config.data = JSON.stringify(config.data)； config.headers = {Content-Type’:‘application/json’ }。

axios.interceptors.request.use(
  config => {
    // Do something before request is sent
    if (store.getters.token) {
      // 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
      config.headers['X-Token'] = getToken()
    }
    config.data = JSON.stringify(config.data)
    config.headers = {
      'Content-Type': 'application/json'
    }
    return config
  },
  error => {
    // Do something with request error
    console.log(error) // for debug
    Promise.reject(error)
  }
)
	

需要后端配合，到这一步已经能解决跨域问题了。但是你会发现参数都是query请求，直接拼接在url后面。后端在body中拿不到数据，axios的post请求参数要写在data中，不是params

post请求需要加上method，不写的话默认get请求

request({
    url: 'url1',
    data: { a: 11, b: 2, c: 3 },
    method: 'post'
  })

get请求

request({
    url: '/admin/user/selectById',
    params: { id: 1 }
  })

如有问题请联系我~

欢迎加入QQ群: