解决跨域问题

跨域问题指：

一个域名下的js脚本，没有经过允许是不能读取另一个域名内容。但浏览器不阻止你发送请求，只是限制读取响应的内容(保护服务器)

只限制的是js脚本，并不限制src，form表单提交之类的读取。就是说form表单提交不存在安全问题，ajax提交跨域存在安全问题。

其中一个不同，均为跨域：协议、域名、端口号

解决方案一：CORS-跨域资源共享

在服务器中设置一个允许跨域的头，允许客户端访问我们服务器

//允许的请求方式
Access-Control-Allow-Methods value=“OPTIONS,POST,GET”
//允许传递的请求
Access-Control-Allow-Headers value=“x-requested-with,content-type”
//允许请求的路径
Access-Control-Allow-Origin value=""

或选择nodejs中设置：

//nodejs设置跨域访问
app.all('‘, function(req, res, next) {
res.header(“Access-Control-Allow-Origin”, “*”);
res.header(“Access-Control-Allow-Headers”, “X-Requested-With”);
res.header(“Access-Control-Allow-Methods”, “PUT,POST,GET,DELETE,OPTIONS”);
res.header(“X-Powered-By”, ’ 3.2.1’);
res.header(“Content-Type”, “application/json;charset=utf-8”);
next();

解决方案二：代理跨域

webpack提供了devServer功能，在vue.config.js文件中，添加以下代码

devServer:{//nodejs开发的超简易服务器。为什么代理？因为，服务器与服务器没有跨域问题~
    proxy:{
      //发请求时，路径中带有/api，代理服务器就会工作。代理服务器找真实服务要数据
      //若请求路径中，没有/api,代理服务器就不会工作，不会进行转发
      '/api':{
        target:'http://gmall-h5-api.atguigu.cn',//target是提供数据的服务器地址
        pathRewrite:{'/api':''} //路径重写
      }
}}

解决方案三：JSONP

待了解哦