【原生】【通信】---常用的跨域方式---

常用的跨域方式（赵，记住这个就可以了）

简单介绍：

服务器代理

底层原理 http-proxy-middleware

cnpm install http-proxy-middleware -D

app.use(proxy("/abc",{
  //当接口以/ajax开头的时候 将http://localhost:3000这个地址代理到http://m.maoyan.com
  target:"http://m.maoyan.com",
  changeOrigin:true,
  pathRewrite:{
    "^/abc":""
  }
}))

 

 

nginx代理

配置跨域代码 proxy_pass 后面跟一个跨域的地址

 

CORS

header("Access-Control-Allow-Origin: *");

 

JSONP

src不受同源策略的影响

 

---

 记得，这个是跨域报的！！！！！！！！！！！！

 

 

 

主要介绍：

1、服务器代理（实现跨域）

 

 a、需要安装 cnpm install http-proxy-middleware -D   （d的是开发环境 s是生产环境）

 

 

 b、引入 http-proxy-middleware，且设置跨域和重写

 

 

1、服务器代理跨域  http-proxy-middleware
      //我们发现，下面的请求中，都是不同的接口，/ajax 、/books、/users。但是他们的域名都一样：http://m.maoyan.com。
        那么该如何解决这样的跨域问题呢？
        解决方法：
                app.use(proxy("/api",{  //跨域解决方法，使用的是服务器代理
                    target:"http://m.maoyan.com",   //当前target 只能指向一个域名，不能能写多个。
                    changeOrigin:true,   //为true是许可跨域  // change是改变的意思  Origin起源的意思  整个理解是改变起源，然后true/Flase，是改不改变的意思
                    pathRewrite:{   //这个主要是重写， 
                        "^/api":""  //  //正则，当访问  ^/api 的时候就让它为空字符串，这api 是自由设定的，主要是统一接口
                    }
                    }))
        http://m.maoyan.com/ajax/movieOnInfoList?token=
        http://m.maoyan.com/books/movieOnInfoList?token=
        http://m.maoyan.com/users/movieOnInfoList?token=

        //设置需要多个不同接口的跨域变成同一个接口api,然后再把这个设定的这api 接口变为空字符，这样就可以实现多个不同接口解决跨域的问题了
        http://m.maoyan.com/api/ajax/movieOnInfoList?token=
        http://m.maoyan.com/api/books/movieOnInfoList?token=
        http://m.maoyan.com/api/users/movieOnInfoList?token=

        http://m.maoyan.com/ajax/movieOnInfoList?token=
        http://m.maoyan.com/books/movieOnInfoList?token=
        http://m.maoyan.com/users/movieOnInfoList?token=