前端跨域的几种方式

同源策略即：同一协议，同一域名，同一端口号。当其中一个不满足时，我们的请求即会发生跨域问题。

三种跨域方法
第一个CORS跨域
第二个JSONP 跨域
第三个代理跨域

CORS跨域

前端直接调用就可以了
在vue中安装axios

import axios from ‘axios’

axios(url).then(()=>{

})

jsonp跨域

安装jsonp
import jsonp from ‘jsonp’

mounted(){
    let url = 'https://www.imooc.com/common/adver-getadverlistbymarking?marking=global_newcomer';
    jsonp(url,()=>{
    })
  }

代理跨域

在vue中创建一个 vue.config.js的文件

moduel.exports = {
	devServer:{
		host:"localhost",
		port:8080,
		proxy:{
			'/api':{
				target:'www.baidu.com',
				changeOrigin: true,
				pathRewrite:{
					'api': ''
				}
			}
		}
	}
}

这样就可以直接使用axios去获取数据了

使用axios的时候可以使用VueAxios这样就不用在每个页面都引用

在mian.js中统一引用

import axios from 'axios'
import VueAxios from 'vue-axios'

Vue.use(VueAxios,axios);

这样在其他页面中可以使用 this.axios…