码迷,mamicode.com
首页 > 其他好文 > 详细

Nginx解决跨域问题(CORS)

时间:2020-06-26 01:01:26      阅读:98      评论:0      收藏:0      [点我收藏+]

标签:set   后端服务   content   目录   option   后端   with   include   nginx 配置   

跨域

解决跨域问题一般有两种思路:

CORS
在后端服务器设置 HTTP 响应头,把你需要运行访问的域名加入加入 Access-Control-Allow-Origin中。

jsonp
把后端根据请求,构造 json 数据,并返回,前端用 jsonp 跨域。

这两种思路,本文不展开讨论。

需要说明的是,nginx 根据第一种思路,也提供了一种解决跨域的解决方案。

环境

centos7
nginx:latest

如何配置

编写 enable-cors.conf

参考如下

# allow origin list
set $ACAO ‘*‘;

# set single origin
if ($http_origin ~* (www.helloworld.com)$) {
  set $ACAO $http_origin;
}

if ($cors = "trueget") {
    add_header ‘Access-Control-Allow-Origin‘ "$http_origin";
    add_header ‘Access-Control-Allow-Credentials‘ ‘true‘;
    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‘;
}

if ($request_method = ‘OPTIONS‘) {
  set $cors "${cors}options";
}

if ($request_method = ‘GET‘) {
  set $cors "${cors}get";
}

if ($request_method = ‘POST‘) {
  set $cors "${cors}post";
}

引入配置

# ----------------------------------------------------
# 此文件为项目 nginx 配置片段
# 可以直接在 nginx config 中 include(推荐)
# 或者 copy 到现有 nginx 中,自行配置
# www.helloworld.com 域名需配合 dns hosts 进行配置
# 其中,api 开启了 cors,需配合本目录下另一份配置文件
# ---------------------------------------------------
server {
  listen       80;
  server_name  *****.com;

  location ~ ^/api/ {
    include enable-cors.conf;   ####关键语句
    proxy_pass http://api_server;
    rewrite "^/api/(.*)$" /$1 break;
  }

  location ~ ^/ {
    proxy_pass http://front_server;
  }
}

针对如何解决跨域,方案有很多,本文只是提供了一种思路,方便学习参考
参考文章

Nginx解决跨域问题(CORS)

标签:set   后端服务   content   目录   option   后端   with   include   nginx 配置   

原文地址:https://www.cnblogs.com/ylcode/p/13193389.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!