vue开发之解决跨域问题

在vue开发的过程中，跨域问题是最常见的一个问题，小编给大家提供了几种解决方案，希望对大家有所帮助。主要的解决方法如下：

一、后台更改header

header('Access-Control-Allow-Origin:*');//允许所有来源访问 
header('Access-Control-Allow-Method:POST,GET');//允许访问的方式

二、使用http-proxy-middleware 代理解决（项目使用vue-cli脚手架搭建）

打开config/index.js，在proxyTable中添写如下代码：

proxyTable: { 
 '/api': { 
  target: '填写请求源地址', //源地址 
  changeOrigin: true, //是否跨域
  pathRewrite: { 
   '^/api': '' //路径重写 
   } 
 } 
}

三、Jquery jsonp

methods: { 
 getData () { 
  var self = this
  $.ajax({ 
   url: '地址', 
   type: 'GET', 
   dataType: 'JSONP', 
   success: function (res) { 
    self.data = res.data.slice(0, 3)
    self.opencode = res.data[0].opencode.split(',') 
   } 
  }) 
 } 
}