前端解决跨域问题的几种方式跨域：指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javasc

1：什么是跨域

跨域：指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。同源策略：两个页面之间，端口，协议，域名任何一个不同都会产生跨域。现实工作开发中经常会有跨域的情况，因为公司会有很多项目，也会有很多子域名，各个项目或者网站之间需要相互调用对方的资源，避免不了跨域请求。

2：如何解决跨域

1.JSONP JSONP优点是兼容性好，可用于解决主流浏览器的跨域数据访问的问题。缺点是仅支持get方法具有局限性。原生实现：

var script = document.createElement(‘script’);
script.type= ‘text/javascript’;
script.src=’xxx?callback=onBack’
document.head.appendChild(script);
function onBack(res) { // 回调函数
}

Ajax实现：

$.ajax({
url: ‘xxxx’,
Type: ‘get’
dataType: ‘jsonp’
data: {}
})

2：websock WebSocket是HTML5一种新的协议可以实现浏览器和服务器之间的实时的，双向通讯。同时允许跨域通信


let ws = new WebSocket("ws://localhost:8181");
ws.onopen = function() {
  console.log("client：打开连接");
  ws.send("client：hello，服务端");};
ws.onmessage = function(e) {
  console.log("client：接收到服务端的消息 " + e.data);
  setTimeout(() => {
    ws.close();
  }, 5000);};
  
ws.onclose = function(params) {
  console.log("client：关闭连接");};

3：走代理 vue +webpack+ 由于vue渲染服务和接口代理服务都是webpack-dev-server同一个，所以页面与代理接口之间不再跨域，无须设置headers跨域信息了。 webpack.config.js部分配置：

 proxyTable: {// 当你请求是以/v2开头的接口，则我帮你代理访问到https://api.douban.com
      '/v2/*': {
        target: 'https://api.douban.com', // 你接口的域名
        secure: false, // 如果是https接口，需要配置这个参数
        changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
      }
    },

解决跨域的方式有多种，nod.js的中端代理，Nginx的反向代理，这里暂时就列举了其中的3种，有不对的地方，还请指出。