服务报价 | 域名主机 | 网络营销 | 软件工具| [加入收藏]
 热线电话: #
当前位置: 主页 > 开发教程 > JavaScript教程 >

JavaScript同源策略以及跨域

时间:2016-02-26 23:59来源:未知 作者:最模板 点击:
JavaScript 同源策略 概念:同源策略是客户端脚本(尤其是JavaScript)的重要安全度量标准。其目的是防止某个文档或脚本从多个不同源装载。 同源指的是:协议,域名(包括子域名),端口相
JavaScript 同源策略
 
概念:同源策略是客户端脚本(尤其是JavaScript)的重要安全度量标准。其目的是防止某个文档或脚本从多个不同源装载。
 
同源指的是:协议,域名(包括子域名),端口相同。同源策略是一种安全协议。
 
具体表现在JS中:一段脚本自能读取来自同一来源的窗口的文档和属性。(iframe.contentDocument 等访问错误)
 
为什么要有同源限制?
 
如果没有同源策略,黑客通过iframe伪造一个网银登录界面,在父页面上直接获取iframe里面输入框的值。就能完成窃取账号密码的侵入行为。
 
跨域的一些方案
 
只列出了一些方案,具体示例可查看参考链接里面的文章。
 
document.domain
 
通过iframe嵌入页面
修改两个页面的 document.domain 为相同的主域(适用于主域相同,子域不同的页面通信,修改domain只能修改为自身或更高一级)
两个页面的 JavaScript通过对应的方法和属性访问彼此的元素和属性
jsonp
 
本地提供需要执行的方法
动态加载 script 提供callback参数
动态请求 script,服务端塞入数据 jsonp(json with padding)
请求完的 script 在页面上执行(已塞入远端数据)
window.name (个人感觉使用 window.name 跨域的方式比较鸡肋,一定是我打开的方式不对吧)
 
原理:一个窗口(window)的生命周期内,窗口载入的所有页面都共享一个 window.name,每个页面对window.name 都有读写权限。(在测试中觉得父页面和iframe是不共享 window.name 的)
生命周期是指一个tab页面从打开到关闭。包括发生在该页面上的跳转操作。只要没有关闭页面,依旧可以读取之前设置的window.name 属性。
跨域实现:首先在 parent 页面通过 iframe 引入要设置 window.name 的页面,待页面加载完毕后,跳转到和 parent 页面同域的一个中间页面(保留了目标页面设置的 window.name 属性)。在父页面通过获取 iframe,调用 iframe.contentWindow.name 获取到设置好的 window.name 属性。
HTML5 postMessage
 
HTML5 所提供的一个 API 方法
window.postMessage(data, origin) 向 origin 匹配域页面发送 data 数据。
window.onmessage = function(msg) {} 监听 message 事件,在收到 post 过来的数据时触发。 msg.data存储传递过来的message,msg.soruce 存储发送消息的窗口对象,msg.origin 存储发送消息的窗口的源(协议+主机+端口号)
(责任编辑:最模板)
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
栏目列表
热点内容