什么是跨域及怎么解决跨域问题？

一、什么是跨域？

跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。

所谓同源是指，域名，协议，端口均相同，只要有一个不同，就是跨域。

二、解决跨域的方法：

这里主要介绍一下jsonp解决跨域的方法

1.JSONP

原理：一般的 ajax是不能进行跨域请求的，但 img、iframe 、script等标签是个例外，这些标签可以通过 src属性请求到其他服务器上的数据，具体是利用script标签的src属性，将前端方法作为参数传给后端，再将后端返回的数据，作为js代码传回前端。前端通过callback回调函数，拿到它的实参，就得到了后端返回的数据。

JSONP由两部分组成：回调函数和数据。回调函数是当响应到来时应该在页面中调用的函数，而数据就是传入回调函数中的JSON数据。

注意代码如下:

<script src='http://www.baidu.com/api?callback=fn()'>
function fn(){
     console.log(1111);
}

注意:

1. jsonp只能使用get请求。

2. jsonp核心是通过动态添加script标签来调用服务器提供的js脚本。

   优点：兼容性好、可以直接访问响应文本。
   缺点：安全问题、只能支持get请求。
   

2.代理

代理，也称正向代理，是指一个位于客户端和目标服务器(target server)之间的服务器，为了从目标服务器取得内容，客户端向代理发送一个请求并指定目标(目标服务器)，然后代理向目标服务器转交请求并将获得的内容返回给客户端。

var proxyMiddleWare= require('http-proxy-middleware');   //引入代理的中间件
var proxyPath = "http://47.104.208.182:8087";//目标后端服务地址
var proxyOption ={
    target:proxyPath,
    changeOrigoin:true,
    // 修改响应头信息，实现跨域并允许带cookie,携带cookie的时候Access-Control-Allow-Origin不能设置为*
  onProxyRes: function(proxyRes, req, res) {
      res.header('Access-Control-Allow-Origin', 'http://www.aa.com');//允许前端跨域的域名
      res.header('Access-Control-Allow-Credentials', 'true');
  },
};
app.use("*",proxyMiddleWare(proxyOption));