Nginx配置跨域请求 CORS
当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给Nginx服务器配置响应的header参数:
一、 解决方案
只需要在Nginx的配置文件中配置以下参数:
location / {
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept";
add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";
}
上面配置代码即可解决问题了,不想深入研究的,看到这里就可以啦=-=
二、 解释
1. Access-Control-Allow-Origin
服务器默认是不被允许跨域的。给Nginx服务器配置Access-Control-Allow-Origin *后,表示服务器可以接受所有的请求源(Origin),即接受所有跨域的请求。
2. Access-Control-Allow-Headers 是为了防止出现以下错误:
Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.
这个错误表示当前请求Content-Type的值不被支持。其实是我们发起了"application/json"的类型请求导致的。这里涉及到一个概念:预检请求(preflight request),请看下面"预检请求"的介绍。
3. Access-Control-Allow-Methods 是为了防止出现以下错误:
Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.
发送"预检请求"时,需要用到方法 OPTIONS ,所以服务器需要允许该方法。
三、 预检请求(preflight request)
其实上面的配置涉及到了一个W3C标准:CROS,全称是跨域资源共享 (Cross-origin resource sharing),它的提出就是为了解决跨域请求的。
跨域资源共享(CORS)标准新增了一组 HTTP 首部字段,允许服务器声明哪些源站有权限访问哪些资源。另外,规范要求,对那些可能对服务器数据产生副作用的HTTP 请求方法(特别是 GET 以外的 HTTP 请求,或者搭配某些 MIME 类型的 POST 请求),浏览器必须首先使用 OPTIONS 方法发起一个预检请求(preflight request),从而获知服务端是否允许该跨域请求。服务器确认允许之后,才发起实际的 HTTP 请求。在预检请求的返回中,服务器端也可以通知客户端,是否需要携带身份凭证(包括 Cookies 和 HTTP 认证相关数据)。
其实Content-Type字段的类型为application/json的请求就是上面所说的搭配某些 MIME 类型的 POST 请求,CORS规定,Content-Type不属于以下MIME类型的,都属于预检请求:
application/x-www-form-urlencoded
multipart/form-data
text/plain
所以 application/json的请求 会在正式通信之前,增加一次"预检"请求,这次"预检"请求会带上头部信息 Access-Control-Request-Headers: Content-Type:
OPTIONS /api/test HTTP/1.1
Origin: http://foo.example
Access-Control-Request-Method: POST
Access-Control-Request-Headers: Content-Type
... 省略了一些
服务器回应时,返回的头部信息如果不包含Access-Control-Request-Headers: Content-Type则表示不接受非默认的的Content-Type。即出现以下错误:
Request header field Content-Type is not allowed by Access-Control-Allow-Headers in preflight response.
转自:http://blog.51cto.com/13523664/2060430
Nginx配置跨域请求 CORS的更多相关文章
- NGINX: 配置跨域请求
说明: 内容全部来自 SegmentFault Developer Nginx 配置跨域请求 跨域请求失败, nginx 报错: 403 No 'Access-Control-Allow-Origin ...
- Nginx配置跨域请求 Access-Control-Allow-Origin *
当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给Nginx服 ...
- Nginx配置跨域请求“Access-Control-Allow-Origin”
当出现403跨域错误的时候 No 'Access-Control-Allow-Origin' header is present on the requested resource,需要给Nginx服 ...
- Django-缓存机制、跨域请求(CORS)、ContentType组件
Django缓存机制: 在settings中间件里面设置: 三个粒度: 1 全站缓存 用中间件: MIDDLEWARE = [ # 'django.middleware.cache.UpdateCac ...
- eclipse加速/Nginx配置跨域代理
下班时间到啦! --下班都是他们的,而我,还是什么都没有. eclipse加速 去掉包含js文件的包的js验证,否则每次启动都需要进行校验(右击项目->properties) Nginx配置跨域 ...
- Nginx配置跨域支持功能
跨域是前端开发中经常会遇到的问题,前端调用后台服务时,通常会遇到 No 'Access-Control-Allow-Origin' header is present on the requested ...
- .NET 反向代理 YARP 跨域请求 CORS
使用过 nginx 的小伙伴应该都知道,这个中间件是可以设置跨域的,作为今天的主角,同样的 反向代理中间件的 YARP 毫无意外也支持了跨域请求设置. 有些小伙伴可能会问了,怎样才算是跨域呢? 在 H ...
- Spring 完美配置跨域请求
在SpringBoot2.0 上的跨域 用以下代码配置 即可完美解决你的前后端跨域请求问题 import org.springframework.context.annotation.Bean; im ...
- nginx配置跨域、gzip加速、代理详细讲解
1.配置跨域 这个很简单,直接打开配置nginx.conf ,在http下配置下面三行代码:当然如果你是想某一个虚拟主机下跨域,那就在哪个server下面添加 add_header Access-Co ...
随机推荐
- Atcoder4105 Same Integers(模拟)
https://abc093.contest.atcoder.jp/tasks/arc094_a?lang=en 思路题还是不太会做哈.感觉数据不大,一开始dfs做但是发现不是最优解,一想确实是这么一 ...
- JSON序列——保存修改数据
JSON序列——保存修改数据 procedure TForm1.Button6Click(Sender: TObject); begin var delta: TynJsonDelta := TynJ ...
- 【linux】【tomcat】linux下定时重启tomcat
步骤: 一.创建脚本文件,本脚本文件用于停止,重启tomcat运行的java进程,并设置脚本文件权限 1.新建脚本文件tomcat.sh [注意文件创建的路径] [查看当前路径的命令: pwd] ...
- cocos creator热更新教程
1.下载HotUpdate热更新DEMO 2.在cocos creator中下载热更新插件,cocos creator版本要在1.7及以上版本 3.插件默认安装在C:\Users\Administra ...
- $.contents().find设置的data在iframe子页面无法获取值
<iframe src="iframe16.html" id="iframe16" name="iframe16"></i ...
- 【JavaScript从入门到精通】第二课 初探JavaScript魅力-02
第二课 初探JavaScript魅力-02 变量 说起变量,我们不得不提起我们有一部比较古老的电视剧叫<包青天>.包青天有一把非常厉害的宝剑叫“尚方宝剑”,见到尚方宝剑有如见到皇帝.某种程 ...
- 实时查看docker容器日志
实时查看docker容器日志 $ sudo docker logs -f -t --tail 行数 容器名 例:实时查看docker容器名为s12的最后10行日志 $ sudo docker logs ...
- Java 基础【19】代理
Java 代理(Proxy)模式与现实中的代理含义一致,如旅游代理.明星的经纪人. 在目标对象实现基础上,增加额外的功能操作,由此来扩展目标对象的功能. JavaWeb 中最常见的过滤器.Struts ...
- Mathmatica简介
作者:桂. 时间:2018-06-27 21:53:34 链接:https://www.cnblogs.com/xingshansi/p/9236502.html 前言 打算系统学习一些数学知识,容 ...
- Docker使用exec进入正在运行中的容器
docker在1.3.X版本之后提供了一个新的命令exec用于进入容器,这种方式相对简单一些,下面我们来看一下该命令的使用: docker exec --help 接下来我们使用该命令进入一个已经在运 ...