允许浏览器跨域访问web服务端的解决方案
今天和同事探讨了前后端如何真正实现隔离开发的问题，如果前端单独作为服务发布，势必会涉及到无法直接调用后端的接口的问题，因为浏览器是不允许跨域提交请求的。
所谓跨域访问，就是在浏览器窗口，和某个服务端通过某个协议+域名+端口号建立了会话的前提下，去使用与这三个属性任意一个不同的源提交了请求，比如:打开新窗口，iframe,xmlhttprequest，那么浏览器就认为你是跨域了，违反了浏览器的同源策略。
解决此问题，w3c标准中，有针对跨域请求的规范：
在响应头中带上Access-Control-Allow-Origin，值是你允许跨域访问的源，比如http://www.baidu.com，注意这里只支持*（表示所有源）号或者某个源，不支持多个源，如果要实现多个源，可以自己包装一个集合，对每次的请求在集合中判断是否存在，如存在，就放到响应头中来；
使用Access-Control-Allow-Methods 限制允许跨域访问的http方法类型，多个以逗号隔开，比如：POST,GET,OPTIONS
使用Access-Control-Allow-Headers，限制允许跨域访问的http头，包含这里设置的头，才允许跨域访问 比如：foo-x
对于客户端在发送请求的时候，浏览器会检测如果本次请求是一个非简单的跨域请求，就会先发送一个OPTIONS的请求到后台预检一下是否支持本源的跨域，如果支持，后台就用上面提到的几个响应头信息告诉浏览器，接着浏览器会发送真正的请求到后台，否则请求将不会得到结果，浏览器会报违反同源策略的警告。
关于简单跨域请求和非简单跨域请求解释如下：
CORS(Cross Origin Resourse-Sharing),中文意思是跨域资源共享，定义了两种跨域请求，简单跨域请求和非简单跨域请求。当一个跨域请求发送简单跨域请求包括：请求方法为HEAD，GET，POST;请求头只有4个字段，Accept，Accept-Language，Content-Language，Last-Event-ID;如果设置了Content-Type，则其值只能是application/x-www-form-urlencoded,multipart/form-data,text/plain，所以，我们设置一下content-type为其它的值，比如application/json,此次请求就会被认为是非简单跨域请求，浏览器就会提交预检请求了。
最新文章
- 微信小程序之用户数据解密(七)
- require.js工作原理（初始）
- 用c语言编写二分查找法
- IOS 导航栏属性设置
- C学习笔记之预处理指令
- js javascript 简易随机值穿插加解密【原】
- openv
- 清除Linux日志文件命令
- js和jquery获取当前元素的内容
- css学习(1)
- Python中模块的发布与安装
- python list的一个面试题
- Mysql - 参数修改
- deque Comparison of Queue and Deque methods Comparison of Stack and Deque methods
- springBoot 打包 dubbo jar包
- java面试第三天
- php session目录找不到的错误 Error session_start(): open(/var/lib/php/session error
- 十分钟掌握pandas（pandas官方文档翻译）
- Python单元测试框架unittest使用方法讲解
- C# params 动态参数