nginx解决前后端分离跨域访问

什么是跨域访问？

跨域指的是通过在网页上加载脚本或资源时，该网页从一个域名的服务器请求数据，而该数据来自于另一个域名的服务器返回。由于浏览器存在同源策略（Same Origin Policy），导致前端无法直接访问其他域名下的资源。

前后端分离开发模式中，前端代码和后端代码是分开部署的。前端代码通常托管在一个域名下，如 http://front.example.com，而后端代码则托管在另一个域名下，如 http://back.example.com。在这种情况下，由于安全机制的限制，前端页面不能直接访问后端接口，这就涉及到了跨域问题。

例如，在 http://front.example.com 页面上，通过 JavaScript 代码请求 http://back.example.com/api/user 接口的数据就属于跨域。

解决方法

为了解决跨域问题，可以使用CORS（Cross-Origin Resource Sharing）技术。CORS是一种标准化的技术，它定义了浏览器如何进行跨域访问，并且允许服务器在响应头中声明哪些地址有权访问数据。通过在服务端允许前端域名的请求，并在响应头中设置相关参数，可以解决跨域问题。但是，在响应头中配置允许的前端域名时要十分小心，否则可能会引起安全问题。

以下为更改nginx配置文件解决跨域访问问题

location / {
  # 允许所有来源的跨域请求
  add_header 'Access-Control-Allow-Origin' '*';
  add_header 'Access-Control-Allow-Methods' 'GET, POST, 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';
  add_header 'Access-Control-Allow-Credentials' 'true';
  if ($request_method = 'OPTIONS') {
    return 200;
  }
}

其中 '*' 表示允许任何来源的跨域请求。如果需要限制跨域请求的来源，则需将 '*' 替换为指定域名。