同源策略

同源策略

同源策略限制从一个源加载的文档或者脚本如何与来自另一个源的资源进行交互。这是一个用于隔离潜在恶意文件的关键的安全机制。

具体定义是:一段脚本向后台请求数据,只能读取属于同一协议名、同一主机名、同一端口号下的数据。因此,请求不同协议名、不同主机名、不同端口号下的文件,违背同源策略,无法请求成果,需要进行跨域处理。

同源策略限制的具体行为:

(1)Cookie、LocalStorage、IndexDB无法读取;

(2)DOM无法获得;

(3)AJAX请求不能发送。

什么是跨域?

两个页面之间的请求,协议、域名、端口都必须相同,才算在同一个域,否则就是跨域。

直接通过FORM表单提交的post/get请求不受同源策略限制,因此需要设置csrf_token防范CSRF攻击。

跨域处理方法

CORS——服务端放开跨域限制(即XHR2)

CORS,Cross-Origin Resource Sharing,跨域资源共享

CORS定义了一种浏览器和服务器交互的方式来确定是否允许跨域请求。CORS是一种网络浏览器的技术规范,它为Web服务器定义了一种方式,允许网页从不同的域访问其资源。 CORS允许一个域上的网络应用向另一个域提交跨域AJAX请求。只需服务器发送一个响应header即可。

由于有同源策略,跨域请求默认是禁止的。

CORS通过设置HTTP Header Access-Control-Allow-Origin实现:

Access-Control-Allow-Origin:*  //允许所有域名的脚本访问该资源
Access-Control-Allow-Origin:http://a.b.com //允许特定域名访问该资源
Access-Control-Allow-Methods:GET, PUT, DELETE, POST //允许的跨域请求
Access-Control-Allow-Headers:content-type //允许跨域请求保护header
Access-Control-Max-Age:xxx //跨域有效期内不需要重新发送预校验(OPTIONS)请求

CORS流程:JS先发出跨域请求,再检查响应中的“Access-Control-Allow-Origin”头。如果这个头允许当前页面跨域访问,则可以读取响应,否则被禁止访问。如果不是简单的CORS,则先发送OPTIONS进行预校验,允许访问再发送跨域请求。

代理

方法一:通过后端(ASP、ASP.NET、JAVA、PHP)获取其他域名下内容,再将结果返回前端。

方法二:NGINX反向代理转发

NGINX代理,转换为同域名。CORS的致命缺点:AJAX不会把cookie中的session id也发送过去。

方法三:NGINX方向代理,通过NGINX进行CORS控制。

JSONP

jsonp只支持get请求,不支持post。

原理:动态引入script标签,而script标签的src是可以跨域的。

iframe

通过修改document.domain来跨域:只能把document.main设置成自身或者更高一级的父域,且主域必须相同。——实现不同字域的框架间的交互。

可以用隐藏的iframe做代理,让iframe载入一个与AJAX目标页面处在相同域的页面,因此,该iframe可以正常使用AJAX获取数据,再通过修改document.domain,让主页面的js可以完全控制iframe。

AJAX四种跨域处理方法的更多相关文章

  1. js 几种跨域解决方法

    同源策略: JS只能与同一个域中的页面进行通讯,必须是协议.域名.端口都相同,相同域下才能相互通信,这可以被认为是一种通信原则,叫同源策略. 跨域: js跨域是指通过js在不同的域之间进行数据传输或通 ...

  2. ajax原理和跨域解决方法

    ajax是异步的 JavaScript 和 XML.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新. 1--启动 ...

  3. 「JavaScript」四种跨域方式详解

    超详细并且带 Demo 的 JavaScript 跨域指南来了! 本文基于你了解 JavaScript 的同源策略,并且了解使用跨域跨域的理由. 1. JSONP 首先要介绍的跨域方法必然是 JSON ...

  4. 「JavaScript」JS四种跨域方式详解

    原文地址https://segmentfault.com/a/1190000003642057 超详细并且带 Demo 的 JavaScript 跨域指南来了! 本文基于你了解 JavaScript ...

  5. js处理的8种跨域方法

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  6. JavaScript最全的10种跨域共享的方法

    在客户端编程语言中,如javascript和ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义.同源策略规定跨域之间的脚本是隔离的,一个域的脚本不能访问和 ...

  7. 解决ajax跨域的方法原理详解之Cors方法

    1.神马是跨域(Cross Domain)   对于端口和协议的不同,只能通过后台来解决.   一句话:同一个ip.同一个网络协议.同一个端口,三者都满足就是同一个域,否则就是 跨域问题了.而为什么开 ...

  8. JSONP和CORS两种跨域方式的优缺点及使用方法原理介绍

    随着软件开发分工趋于精细,前后端开发分离成为趋势,前端同事负责前端页面的展示及页面逻辑处理,服务端同事负责业务逻辑处理同时通过API为前端提供数据也为前端提供数据的持久化能力,考虑到前后端同事开发工具 ...

  9. JQuery - Ajax和Tomcat跨域请求问题解决方法!

    在JQuery里面使用Ajax和Tomcat服务器之间进行数据交互,遇到了跨域请求问题,无法成功得到想要的数据! 错误信息部分截图: 通过错误信息判断知道已经发生在Ajax跨域请求问题了! 当前Tom ...

随机推荐

  1. 【Canal源码分析】数据传输协议

    Canal的数据传输有两块,一块是进行binlog订阅时,binlog转换为我们所定义的Message,第二块是client与server进行TCP交互时,传输的TCP协议. 一.EntryProto ...

  2. 微信小程序(wx:for)遍历对象

    最近在折腾微信小程序,遇到这么一个情况:后端返回一个key-value的对象数据,需要遍历对象的key-value,然后渲染到视图中.就像下面这样: { '2018-1-9':{ address: ' ...

  3. 一口一口吃掉Hexo(四)

    如果你想得到更好的阅读效果,请访问我的个人网站 ,版权所有,未经许可不得转载! 人总是不会满足于现状,接下来我们就可以让我们的朋友们通过独立域名访问我们的网站了,但是这肯定是要花点钱的,所以这篇文章难 ...

  4. StreamSets学习系列之启动StreamSets时出现Caused by: java.security.AccessControlException: access denied ("java.util.PropertyPermission" "test.to.ensure.security.is.configured.correctly" "read")错误的解决办法

    不多说,直接上干货! 问题详情 [hadoop@master streamsets-datacollector-]$ ./bin/streamsets dc Java 1.8 detected; ad ...

  5. 全网最详细的Oracle10g/11g的官方下载地址集合【可直接迅雷下载安装】(图文详解)

    不多说,直接上干货! 方便自己,也方便他人查阅. Oracle 11g的官网下载地址:  http://www.oracle.com/technetwork/database/enterprise-e ...

  6. Tomcat学习总结(2)——Tomcat使用详解

    一.Tomcat服务器端口的配置 Tomcat的所有配置都放在conf文件夹之中,里面的server.xml文件是配置的核心文件. 如果想修改Tomcat服务器的启动端口,则可以在server.xml ...

  7. Spring Aop 注解方式参数传递

    v\:* {behavior:url(#default#VML);} o\:* {behavior:url(#default#VML);} w\:* {behavior:url(#default#VM ...

  8. 使用WireShark分析使用RedisTemplate取不到值的问题

    现象:使用Java Redis客户端将数据存放到Redis后,使用redisTemplate却不出来原因:Java Redis客户端在将数据存放在Redis时,会对Key,Value,Field进行编 ...

  9. Netty 接受请求过程源码分析 (基于4.1.23)

    前言 在前文中,我们分析了服务器是如何启动的.而服务器启动后肯定是要接受客户端请求并返回客户端想要的信息的,否则要你服务器干啥子呢?所以,我们今天就分析分析 Netty 在启动之后是如何接受客户端请求 ...

  10. 并发编程 —— Java 内存模型总结图

    关于 Java 内存模型的类似思维导图. 如有错误,还请指正.