【JavaScript】frame跨域访问元素

什么是跨frame访问元素呢?比如main.html中有如下代码:

<frameset cols="50%,*">
  <frame src="frame1.html">
  <frame src="frame2.html">
</frameset>

如果想在frame2.html的页面操作frame1.html中的元素,那么通过如下的js代码就可以完成:

parent.frames[0].document

其中parent表示访问main.html的文档。frames[0]表示访问main.html中的第一个frame对象,也就是frame1.html页面。也可以通过name来指定访问特定的页面,例如:

<frameset cols="50%,*">
  <frame name="myframe1" src="frame1.html">
  <frame name="myframe2" src="frame2.html">
</frameset>

frame2.html中的访问代码就可以改为:

parent.frames["myframe1"].document

到这里我们知道了frame之间如何访问元素,笔者这里只是列举了一种方法,有兴趣的读者可以自行googling。那么什么是跨域访问元素呢?

若我们把上面main.html中的一个frame指向其它的域名地址(比如:www.google.com),那么我们还能正常在myframe2中操作myframe1中的元素吗?

<frameset cols="50%,*">
  <frame name="myframe1" src="www.google.com">
  <frame name="myframe2" src="frame2.html">
</frameset>

答案是不行!在myframe2中操作myframe1中的元素,会得到如下的错误信息:frame Blocked a frame with origin "null" from accessing a cross-origin frame.

浏览器是禁止这种行为的。那么有没有什么方法可以实现这种操作呢?

答案是有的,解决方法有多种,笔者稍后会把链接粘贴在后面。这里笔者说一下,笔者可行方法(就是禁用浏览器的安全域检查):

笔者的Chrome是75.0.3770.142,环境是win7。

然后使用如下的命令启动chrome浏览器:

chrome.exe --disable-site-isolation-trials --disable-web-security --user-data-dir="your dir"

读者可以翻阅下面的链接,查看更详细的说明

1.Disable same origin policy in Chrome

2.blocked a frame of origin “null” from accessing a cross-origin frame - chrome

原文地址:https://www.cnblogs.com/HDK2016/p/11199442.html

时间: 2024-10-10 04:48:13

【JavaScript】frame跨域访问元素的相关文章

Javascript 跨域访问解决方案 总结

在客户端编程语言中,如javascript和ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义.同 源策略规定跨域之间的脚本是隔离的,一个域的脚本不能访问和操作另外一个域的绝大部分属性和方法.那么什么叫相同域,什么叫不同的域呢? 同源策略 在客户端编程语言中,如javascript和 ActionScript,同源策略是一个很重要的安全理念,它在保证数据的安全性方面有着重要的意义.同源策略规定跨域之间的脚本是隔离的,一个域的脚本不能访问和操作另外一个

Javascript跨域访问解决方案

Javascript跨域访问解决方案 分类: WEB TIPS 2009-02-13 14:08 15882人阅读 评论(5) 收藏 举报 javascriptiframeservletcallbackdomainfunction 由于安全方面的考虑,Javascript被限制了跨域访问的能力,但是有时候我们希望能够做一些合理的跨域访问的事情,那么怎么办呢?这里分两类情况:一.基于同一父域的子域之间页面的访问:参见如下3个domain域:taobao.com.jipiao.taobao.com.

框架元素-跨域访问-window.name

页面A:页面B,你能传个数据给我吗? 页面B:额,我们不在同一个域内,因为涉及到WEB安全问题,所以浏览器禁止我直接向你传数据. 页面A:有什么办法可以解决这个问题吗? 页面B:可以使用window.name. 页面A:那你需要我做些什么? 页面B:1.你先动态创建一个iframe节点:  2.设置节点属性src指向我:  3.我会设置window.name = 'b':  4.然后你重新设置节点iframe的属性src指向和你在同一个域下的兄弟页面C:  5.虽然属性src的值变了,但是win

JavaScript跨域访问CORS问题

在尝试从一个web前端使用HTTP Request请求访问REST服务端时,遇到错误: XMLHttpRequest cannot load http://localhost:8080/ping. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:63342' is therefore not allowed access. 这个错误是因为A

浏览器的跨域访问

一.浏览器介绍 对于Web应用来说,浏览器是最重要的客户端. 目前浏览器五花八门多得不得了,除了Chrome.IE.Firefox.Safari.Opera这些国外的浏览器外,百度.腾讯.360.淘宝.搜狗.傲游之类的,反正能做的都做了. 浏览器虽然这么多,但浏览器内核主要就以下4种: Trident:IE使用的内核. Gecko:Firefox使用的内核. WebKit:Safair和Chrome使用的内核.WebKit由苹果发明,Chrome也用了,但是Google又开发了V8引擎替换掉了W

Web安全技术(3)-浏览器的跨域访问

http://www.blogjava.net/linli/archive/2015/04/22/424584.html 一.浏览器介绍 对于Web应用来说,浏览器是最重要的客户端. 目前浏览器五花八门多得不得了,除了Chrome.IE.Firefox.Safari.Opera这些国外的浏览器外,百度.腾讯.360.淘宝.搜狗.傲游之类的,反正能做的都做了. 浏览器虽然这么多,但浏览器内核主要就以下4种: Trident:IE使用的内核. Gecko:Firefox使用的内核. WebKit:S

跨域访问实现依据

首先要弄清楚域是含义.这里引用百度知道里的域的一个概念说明: 域(Domain)是Windows网络中独立运行的单位,域之间相互访问则需要建立信任关系(即Trust Relation). 信任关系是连接在域与域之间的桥梁.当一个域与其他域建立了信任关系后,2个域之间不但可以按需要相互进行管理, 还可以跨网分配文件和打印机等设备资源,使不同的域之间实现网络资源的共享与管理. 有一种简明的说法来解释广域跨域:跨域访问,简单来说就是 A 网站的 javascript 代码试图访问 B 网站, 包括提交

跨域访问

iframe方式嵌入页面的操作实验 实验 <html> <body> <h1> hi, this is a.html, frame below show b.html </h1> <iframe src="http://localhost/b.html"></iframe> <script type="text/javascript"> window.onload = functio

浅析JSONP-解决Ajax跨域访问问题

浅析JSONP-解决Ajax跨域访问问题 很久没有写随笔了,总是感觉没时间,其实时间就是...废话少说,前几天,工作上有一新需求,需要前端web页面异步调用后台的Webservice方法返回信息.实现方法有多种,本例采用jQuery+Ajax,完成后,在本地调试了一切ok,但是部署到服务器上以后就出现问题了,后台服务调用没有响应,怎么回事?代码没怎么改动,唯一修改的地方就是jQuery的ajax方法中的url地址.难道是这里的问题,经过检查和调试,发现原来是同源策略在作怪,我们知道,JavaSc