文章来源:http://to-u.xyz/2016/06/30/nginx-cors/

背景描述

最近在研究RESTful API接口设计,使用的是Nginx
要实现本地http://127.0.0.1跨域访问服务器端http://api.zlzkj.com
并且要支持DELETE PUT等请求。

跨域配置

只需要在Nginx配置文件里加入以下配置,即可开启跨域

add_header Access-Control-Allow-Origin *;

*代表任何域都可以访问,可以改成只允许某个域访问,如Access-Control-Allow-Origin: http://www.zlzkj.com
这样的配置虽然开启了跨域请求,但只支持GET HEAD POST OPTIONS请求,使用DELETE发起跨域请求时,浏览器出于安全考虑会先发起OPTIONS请求,服务器端接收到的请求方式就变成了OPTIONS,所以引起了服务器的405 Method Not Allowed。

所以要对OPTIONS请求进行处理

if ($request_method = 'OPTIONS') {
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Methods GET,POST,PUT,DELETE,OPTIONS;
#其他头部信息配置,省略...
return 204;
}

当请求方式为OPTIONS时,设置Allow的响应头,重新处理这次请求。
配置好并重启Nginx,刷新页面重新发起请求,在控制台里你会发现,出现了二次请求,
第一次是OPTIONS请求,第二次才是DELETE请求,这就是对OPTIONS请求进行处理的结果,到这里总算完成了一次DELETE跨域请求了。

完整配置参考

add_header Access-Control-Allow-Origin *;
location / {
if ($request_method = 'OPTIONS') {
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Methods GET,POST,PUT,DELETE,OPTIONS;
return 204;
}
index index.php;
try_files $uri @rewriteapp;
}

  

放到配置文件的server {}

参考文章

http://www.rails365.net/articles/cong-kua-yu-dao-cors-yi
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
https://segmentfault.com/q/1010000005837213

nginx配置 解决ajax请求跨域问题的更多相关文章

  1. Nginx配置解决NetCore的跨域

    使用Nginx配置解决NetCore的跨域 废话不多说,直接上Nginx配置 server { listen 80; server_name 你的Id或域名; location / { add_hea ...

  2. 解决ajax请求跨域

    跨域大部分需要通过后台解决,引起跨域的原因: 3个问题同时满足 才可能产生跨域问题,即跨域(协议,主机名,端口号中有一个不同就产生跨域) 下面是解决方法 方法一 // ajax请求跨域 /* *解决a ...

  3. 解决Ajax请求跨域问题

    from:https://blog.csdn.net/wang379275614/article/details/53333775 上篇文章提到,由于浏览器的同源策略,使得,AJAX请求只能发给同源的 ...

  4. web api 解决Ajax请求跨域问题

    前端ajax请求接口时,经常出现跨域问题,当然了解决方法有很多种,比如: http://www.jb51.net/article/68424.htm 我本人恰好前后端都会一点,所以直接在接口端处理. ...

  5. cors解决ajax请求跨域问题

    Access-Control-Allow-Origin: * 适用tomcat部署的项目 在web.xml里添加以下内容 <filter> <filter-name>CorsF ...

  6. day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记

    课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现   SSO系统就是解决分布式环境下登录问题的,本 ...

  7. 利用Nginx轻松实现Ajax的跨域请求(前后端分离开发调试必备神技)

    利用Nginx轻松实现浏览器中Ajax的跨域请求(前后端分离开发调试必备神技) 前言 为什么会出现跨域? 造成跨域问题的原因是因为浏览器受到同源策略的限制,也就是说js只能访问和操作自己域下的资源,不 ...

  8. Vue Nginx反向代理配置 解决生产环境跨域

    Vue本地代理举例: module.exports = { publicPath: './', devServer: { proxy: { '/api': { target: 'https://mov ...

  9. 处理Ajax请求跨域问题

    ajax跨域的原理 ajax出现请求跨域错误问题,主要原因就是因为浏览器的“同源策略”. CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resourc ...

随机推荐

  1. code signing is required for product type 'Application' in SDK 'iOS 8.1' 错误分析以及解决方案

    在真机测试的时候往往会突然出现这样一个错误,code signing is required for product type 'Application' in SDK 'iOS 7.0'  ,就是说 ...

  2. uva-310-L--system-暴力枚举

    题意:输入四个字符串a,b,w,z,经过一定的替换规则,问w或者w的子串中是否包含z. 替换规则如下.w中的字符a全部替换成a字符串,b字符全部替换成b字符串. 枚举过程, 根据替换规则对w进行替换, ...

  3. Linux实用命令整理

    说明 点击标题可进入详细讲解的章节 0. 基本命令 linux 基本命令整理 1. 压缩 解压 tar -zcvf a.tar.gz a #把a压缩成a.tar.gz tar -zxvf a.tar. ...

  4. Weblogic重起后打开控制台登陆后响应极慢

    linux下Weblogic 重启后第一次打开console登陆后响应极慢(20多分钟)(锁定并编辑第一次也极慢),以后速度就正常了,重启后又会极慢! 在网上看了看,是说linux下的java生成随机 ...

  5. Yii框架中使用SRBAC作为权限管理模块时遇到的问题

    Yii框架中使用SRBAC作为权限管理模块时遇到的问题   看到Yii中提供RBAC的插件,SRBAC,就想用用. 结果按照手册上的安装办法,整来整去,安装完了,可就是进不了权限管理界面. 最后想到, ...

  6. Impala SQL 使用小记

    1.  impala端创建的表,DROP. hive会自动同步到. 但是通过hive DROP时,数据还会在,只是表的元数据没有了. 所以完全DROP表,需要impala端的DROP 2. impal ...

  7. 查SQLserver性能瓶颈

    https://www.cnblogs.com/wayne-ivan/p/3821750.html

  8. VMware设置cpu虚拟化,intel VT-x

    1.关闭虚拟机 2.右键需要更改的虚拟机--设置--处理器

  9. Image.Url 无法使用 Server.MapPath(使用后无论如何也不显示)

    Image.Url 无法使用 Server.MapPath(使用后无论如何也不显示)

  10. cors跨域问题

    同源策略: 是由NetScape提出的著名的安全策略,所有支持javaScript的浏览器都使用这个策略.同源策略限制了一个源中加载文本或脚本与来自其它源中资源的交互方式. IE特例: 授信范围(Tr ...