跨域

一、什么是跨域？
跨域是指从一个域名的网页去请求另一个域名的资源，比如从www.baidu.com页面去请求www.google.com的资源，跨域的严格定义：只要协议，域名，端口有任何一个不同，就被当做跨域。
二、为什么浏览器要限制跨域访问？
原因就是安全问题，如果一个网页可以随意地访问另一个网站的资源，那么久有可能在客户不知情的情况下出现安全问题
三、为什么要跨域？（从一个页面引用其他页面的资源）
既然有安全问题，那为什么又要跨域？有时公司内部有多个不同的子域，不同域之间有资源访问就是跨域
四、跨域解决方案
1、cors

var allowCrossDomain = function(req, res, next) {
  res.setHeader('Access-Control-Allow-Origin', '*') // 自定义中间件，设置跨域需要的响应
  // 允许任何方法
  res.setHeader('Access-Control-Allow-Methods','GET','POST','OPTIONS','PUT','DELETE')
  // 允许任何类型
  res.setHeader('Access-Control-Allow-Headers','X-Requested-with,content-type,X-Session-Token')
  next()
}
app.use(allowCrossDomain) // 运用跨域中间件

2、nginx
windows:在nginx目录查找nginx.conf文件并添加以下内容
Mac: open -t/usr/local/etc/nginx.conf
mac默认ng端口8080

server {
  listen    8089;
  server_name  localhost;
  root   html; #根目录
#cors
add_header Access-Control-Allow-Origin $http_origin always; #'*';
add_header 'Access-Control-Allow-Credentials' 'true' always;
add_header 'Access-Control-Allow-Methods' 'GET, POST, PATCH, DELETE, PUT, OPTIONS';
add_header 'Access-Control-Allow-Headers' 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,  Access-Control-Expose-Headers, Token, Authorization';
add_header 'Access-Control-Max-Age' 1728000;
 add_header 'Content-Type' 'text/plain charset=UTF-8';
 add_header 'Content-Length' 0;
#请求http://localhost:8080/api，将改请求转发到http://localhost:3000/api
location /api {
  proxy_pass http://localhost:3000/api
}
}

关于mac操作
brew services start nginx
brew services stop nginx