在不同的端口号,甚至是不同的ip进行iframe嵌套的时候,在父页面调用子页面的方法的时候,报错
SecurityError: Blocked a frame with origin from accessing a cross-origin frame… 在不同端口号下,不能使用传统的iframe嵌套调用方法。 document.getElementById("mainFrame").contentWindow.xxxx(); 同源安全策略 你不能用javascript访问一个<iframe>,如果你能做到这一点,那将是一个巨大的安全缺陷。对于同一源策略浏览器,阻止脚本尝试访问具有不同源的帧。 如果地址中至少有一个部分未保留,则认为来源不同: <protocol>://<hostname>:<port>/path/to/page.html 如果要访问iframe,协议、主机名和端口必须与域相同。 Examples 下面是尝试访问以下URL时将发生的情况 http://www.example.com/home/index.html URL RESULT http://www.example.com/home/other.html -> Success http://www.example.com/dir/inner/another.php -> Success http://www.example.com:80 -> Success (default port for HTTP) http://www.example.com:2251 -> Failure: different port http://data.example.com/dir/other.html -> Failure: different hostname https://www.example.com/home/index.html.html -> Failure: different protocol ftp://www.example.com:21 -> Failure: different protocol & port https://google.com/search?q=james+bond -> Failure: different hostname & protocol 尽管同一源站策略阻止脚本访问不同源站的内容,但如果您同时拥有这两个页面,则可以使用window.postmessageand其相关消息事件在两个页面之间发送消息来解决此问题。 在主页面: var frame = document.getElementById('your-frame-id'); frame.contentWindow. postMessage (data, '*'); data可以是string,boolean,number,array,object 在iframe子页面 window. addEventListener ('message', function(event) { //event.data获取传过来的数据 注意:父页面的postMessage是触发addEventListener的 参考:https://www.cnblogs.com/wangfuyou/p/6276871.html 在子页面,想使用父页面的参数,但是原因两个的域名不一样,所以会出现跨域问题 解决方法:在子页面 window.postMessage("message", '*');//后面的*号就是处理跨域问题的 然后在父页面 window.addEventListener('message', function (msg) { console.log(msg.data); 设置监听的方法就可以了 在不同的端口号,甚至是不同的ip进行iframe嵌套的时候,在父页面调用子页面的方法的时候,报错 SecurityError: Blocked a frame with origin from accessing a cross-origin frame… 在不同端口号下,不能使用传统的iframe嵌套调用方法。 document.getElementById("mainFram... iframe窗口修改元素,提示Uncaught DOMException: Blocked a frame with origin ** from accessing a cross-origin frame,无法修改 解决办法: 使用 postMessage() 方法用于安全地实现跨源通信 window.postMessage(message,targetOrigin) 方法是html5新引进的特性,可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE <iframe id="mainframe" name="mainframe" frameborder="0" src="/../**" style="overflow-x: hidden; height: 1389px; width: 1000px;" width="1912"></iframe> 显示用a标签,targ... 同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。 如果两个 URL 的protocol、port(如果有指定的话)和host都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是“元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式)。 **Blocked a frame with origin "xxx" from accessing a cross-origin frame.**最近做一个统计问题,要在A服务器向B服务器的发起请求,获取数据显示,刚开始的时候方法和jsp页面都是写在B服务器上的,直接从A服务器发请求,弹出页面就可以了,,但是后来要求做到iframe里面,再向之前那么整就直接出现了跨域的问题,网上查了些资料,现在... /*window.frames[]可以通过下标或名称访问单独的frame*/ window.onload=function(){ var h1=window.frames["header"];//.document.getElementsByTagName('h1'); alert(h1); <iframe name="web" width="100%" frameborder=0 height="0" src="http:xxx.com" id="web" onload="this.height=web.document.body.sc... 2.从编辑器中打开没有问题,但是直接在文件中打开网页,在点击一些事件时,就会出现这种问题,其实这不是跨域问题,因为都没有放到服务器上,这只是因为静态页面直接打开会存在一些问题,若是用编辑器打开页面,就不会有这个问题了。
在不同端口号下,不能使用传统的iframe嵌套调用方法。
document.getElementById("mainFrame").contentWindow.xxxx(); 同源安全策略 你不能用javascript访问一个<iframe>,如果你能做到这一点,那将是一个巨大的安全缺陷。对于同一源策略浏览器,阻止脚本尝试访问具有不同源的帧。 如果地址中至少有一个部分未保留,则认为来源不同: <protocol>://<hostname>:<port>/path/to/page.html 如果要访问iframe,协议、主机名和端口必须与域相同。 Examples 下面是尝试访问以下URL时将发生的情况 http://www.example.com/home/index.html URL RESULT http://www.example.com/home/other.html -> Success http://www.example.com/dir/inner/another.php -> Success http://www.example.com:80 -> Success (default port for HTTP) http://www.example.com:2251 -> Failure: different port http://data.example.com/dir/other.html -> Failure: different hostname https://www.example.com/home/index.html.html -> Failure: different protocol ftp://www.example.com:21 -> Failure: different protocol & port https://google.com/search?q=james+bond -> Failure: different hostname & protocol 尽管同一源站策略阻止脚本访问不同源站的内容,但如果您同时拥有这两个页面,则可以使用window.postmessageand其相关消息事件在两个页面之间发送消息来解决此问题。 在主页面: var frame = document.getElementById('your-frame-id'); frame.contentWindow. postMessage (data, '*'); data可以是string,boolean,number,array,object 在iframe子页面 window. addEventListener ('message', function(event) { //event.data获取传过来的数据 注意:父页面的postMessage是触发addEventListener的 参考:https://www.cnblogs.com/wangfuyou/p/6276871.html 在子页面,想使用父页面的参数,但是原因两个的域名不一样,所以会出现跨域问题 解决方法:在子页面 window.postMessage("message", '*');//后面的*号就是处理跨域问题的 然后在父页面 window.addEventListener('message', function (msg) { console.log(msg.data); 设置监听的方法就可以了 在不同的端口号,甚至是不同的ip进行iframe嵌套的时候,在父页面调用子页面的方法的时候,报错 SecurityError: Blocked a frame with origin from accessing a cross-origin frame… 在不同端口号下,不能使用传统的iframe嵌套调用方法。 document.getElementById("mainFram... iframe窗口修改元素,提示Uncaught DOMException: Blocked a frame with origin ** from accessing a cross-origin frame,无法修改 解决办法: 使用 postMessage() 方法用于安全地实现跨源通信 window.postMessage(message,targetOrigin) 方法是html5新引进的特性,可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE <iframe id="mainframe" name="mainframe" frameborder="0" src="/../**" style="overflow-x: hidden; height: 1389px; width: 1000px;" width="1912"></iframe> 显示用a标签,targ... 同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。 如果两个 URL 的protocol、port(如果有指定的话)和host都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是“元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式)。 **Blocked a frame with origin "xxx" from accessing a cross-origin frame.**最近做一个统计问题,要在A服务器向B服务器的发起请求,获取数据显示,刚开始的时候方法和jsp页面都是写在B服务器上的,直接从A服务器发请求,弹出页面就可以了,,但是后来要求做到iframe里面,再向之前那么整就直接出现了跨域的问题,网上查了些资料,现在... /*window.frames[]可以通过下标或名称访问单独的frame*/ window.onload=function(){ var h1=window.frames["header"];//.document.getElementsByTagName('h1'); alert(h1); <iframe name="web" width="100%" frameborder=0 height="0" src="http:xxx.com" id="web" onload="this.height=web.document.body.sc... 2.从编辑器中打开没有问题,但是直接在文件中打开网页,在点击一些事件时,就会出现这种问题,其实这不是跨域问题,因为都没有放到服务器上,这只是因为静态页面直接打开会存在一些问题,若是用编辑器打开页面,就不会有这个问题了。
同源安全策略 你不能用javascript访问一个<iframe>,如果你能做到这一点,那将是一个巨大的安全缺陷。对于同一源策略浏览器,阻止脚本尝试访问具有不同源的帧。
如果地址中至少有一个部分未保留,则认为来源不同:
<protocol>://<hostname>:<port>/path/to/page.html 如果要访问iframe,协议、主机名和端口必须与域相同。 Examples 下面是尝试访问以下URL时将发生的情况 http://www.example.com/home/index.html URL RESULT http://www.example.com/home/other.html -> Success http://www.example.com/dir/inner/another.php -> Success http://www.example.com:80 -> Success (default port for HTTP) http://www.example.com:2251 -> Failure: different port http://data.example.com/dir/other.html -> Failure: different hostname https://www.example.com/home/index.html.html -> Failure: different protocol ftp://www.example.com:21 -> Failure: different protocol & port https://google.com/search?q=james+bond -> Failure: different hostname & protocol 尽管同一源站策略阻止脚本访问不同源站的内容,但如果您同时拥有这两个页面,则可以使用window.postmessageand其相关消息事件在两个页面之间发送消息来解决此问题。 在主页面: var frame = document.getElementById('your-frame-id'); frame.contentWindow. postMessage (data, '*'); data可以是string,boolean,number,array,object 在iframe子页面 window. addEventListener ('message', function(event) { //event.data获取传过来的数据 注意:父页面的postMessage是触发addEventListener的 参考:https://www.cnblogs.com/wangfuyou/p/6276871.html 在子页面,想使用父页面的参数,但是原因两个的域名不一样,所以会出现跨域问题 解决方法:在子页面 window.postMessage("message", '*');//后面的*号就是处理跨域问题的 然后在父页面 window.addEventListener('message', function (msg) { console.log(msg.data); 设置监听的方法就可以了 在不同的端口号,甚至是不同的ip进行iframe嵌套的时候,在父页面调用子页面的方法的时候,报错 SecurityError: Blocked a frame with origin from accessing a cross-origin frame… 在不同端口号下,不能使用传统的iframe嵌套调用方法。 document.getElementById("mainFram... iframe窗口修改元素,提示Uncaught DOMException: Blocked a frame with origin ** from accessing a cross-origin frame,无法修改 解决办法: 使用 postMessage() 方法用于安全地实现跨源通信 window.postMessage(message,targetOrigin) 方法是html5新引进的特性,可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE <iframe id="mainframe" name="mainframe" frameborder="0" src="/../**" style="overflow-x: hidden; height: 1389px; width: 1000px;" width="1912"></iframe> 显示用a标签,targ... 同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。 如果两个 URL 的protocol、port(如果有指定的话)和host都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是“元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式)。 **Blocked a frame with origin "xxx" from accessing a cross-origin frame.**最近做一个统计问题,要在A服务器向B服务器的发起请求,获取数据显示,刚开始的时候方法和jsp页面都是写在B服务器上的,直接从A服务器发请求,弹出页面就可以了,,但是后来要求做到iframe里面,再向之前那么整就直接出现了跨域的问题,网上查了些资料,现在... /*window.frames[]可以通过下标或名称访问单独的frame*/ window.onload=function(){ var h1=window.frames["header"];//.document.getElementsByTagName('h1'); alert(h1); <iframe name="web" width="100%" frameborder=0 height="0" src="http:xxx.com" id="web" onload="this.height=web.document.body.sc... 2.从编辑器中打开没有问题,但是直接在文件中打开网页,在点击一些事件时,就会出现这种问题,其实这不是跨域问题,因为都没有放到服务器上,这只是因为静态页面直接打开会存在一些问题,若是用编辑器打开页面,就不会有这个问题了。
如果要访问iframe,协议、主机名和端口必须与域相同。
下面是尝试访问以下URL时将发生的情况
http://www.example.com/home/index.html
URL RESULT http://www.example.com/home/other.html -> Success http://www.example.com/dir/inner/another.php -> Success http://www.example.com:80 -> Success (default port for HTTP) http://www.example.com:2251 -> Failure: different port http://data.example.com/dir/other.html -> Failure: different hostname https://www.example.com/home/index.html.html -> Failure: different protocol ftp://www.example.com:21 -> Failure: different protocol & port https://google.com/search?q=james+bond -> Failure: different hostname & protocol 尽管同一源站策略阻止脚本访问不同源站的内容,但如果您同时拥有这两个页面,则可以使用window.postmessageand其相关消息事件在两个页面之间发送消息来解决此问题。 在主页面: var frame = document.getElementById('your-frame-id'); frame.contentWindow. postMessage (data, '*'); data可以是string,boolean,number,array,object 在iframe子页面 window. addEventListener ('message', function(event) { //event.data获取传过来的数据 注意:父页面的postMessage是触发addEventListener的 参考:https://www.cnblogs.com/wangfuyou/p/6276871.html 在子页面,想使用父页面的参数,但是原因两个的域名不一样,所以会出现跨域问题 解决方法:在子页面 window.postMessage("message", '*');//后面的*号就是处理跨域问题的 然后在父页面 window.addEventListener('message', function (msg) { console.log(msg.data); 设置监听的方法就可以了 在不同的端口号,甚至是不同的ip进行iframe嵌套的时候,在父页面调用子页面的方法的时候,报错 SecurityError: Blocked a frame with origin from accessing a cross-origin frame… 在不同端口号下,不能使用传统的iframe嵌套调用方法。 document.getElementById("mainFram... iframe窗口修改元素,提示Uncaught DOMException: Blocked a frame with origin ** from accessing a cross-origin frame,无法修改 解决办法: 使用 postMessage() 方法用于安全地实现跨源通信 window.postMessage(message,targetOrigin) 方法是html5新引进的特性,可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE <iframe id="mainframe" name="mainframe" frameborder="0" src="/../**" style="overflow-x: hidden; height: 1389px; width: 1000px;" width="1912"></iframe> 显示用a标签,targ... 同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。 如果两个 URL 的protocol、port(如果有指定的话)和host都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是“元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式)。 **Blocked a frame with origin "xxx" from accessing a cross-origin frame.**最近做一个统计问题,要在A服务器向B服务器的发起请求,获取数据显示,刚开始的时候方法和jsp页面都是写在B服务器上的,直接从A服务器发请求,弹出页面就可以了,,但是后来要求做到iframe里面,再向之前那么整就直接出现了跨域的问题,网上查了些资料,现在... /*window.frames[]可以通过下标或名称访问单独的frame*/ window.onload=function(){ var h1=window.frames["header"];//.document.getElementsByTagName('h1'); alert(h1); <iframe name="web" width="100%" frameborder=0 height="0" src="http:xxx.com" id="web" onload="this.height=web.document.body.sc... 2.从编辑器中打开没有问题,但是直接在文件中打开网页,在点击一些事件时,就会出现这种问题,其实这不是跨域问题,因为都没有放到服务器上,这只是因为静态页面直接打开会存在一些问题,若是用编辑器打开页面,就不会有这个问题了。
URL RESULT http://www.example.com/home/other.html -> Success http://www.example.com/dir/inner/another.php -> Success http://www.example.com:80 -> Success (default port for HTTP) http://www.example.com:2251 -> Failure: different port http://data.example.com/dir/other.html -> Failure: different hostname https://www.example.com/home/index.html.html -> Failure: different protocol ftp://www.example.com:21 -> Failure: different protocol & port https://google.com/search?q=james+bond -> Failure: different hostname & protocol 尽管同一源站策略阻止脚本访问不同源站的内容,但如果您同时拥有这两个页面,则可以使用window.postmessageand其相关消息事件在两个页面之间发送消息来解决此问题。 在主页面:
尽管同一源站策略阻止脚本访问不同源站的内容,但如果您同时拥有这两个页面,则可以使用window.postmessageand其相关消息事件在两个页面之间发送消息来解决此问题。
window.postmessageand
在主页面:
var frame = document.getElementById('your-frame-id'); frame.contentWindow. postMessage (data, '*'); data可以是string,boolean,number,array,object 在iframe子页面 window. addEventListener ('message', function(event) { //event.data获取传过来的数据 注意:父页面的postMessage是触发addEventListener的 参考:https://www.cnblogs.com/wangfuyou/p/6276871.html 在子页面,想使用父页面的参数,但是原因两个的域名不一样,所以会出现跨域问题 解决方法:在子页面 window.postMessage("message", '*');//后面的*号就是处理跨域问题的 然后在父页面 window.addEventListener('message', function (msg) { console.log(msg.data); 设置监听的方法就可以了 在不同的端口号,甚至是不同的ip进行iframe嵌套的时候,在父页面调用子页面的方法的时候,报错 SecurityError: Blocked a frame with origin from accessing a cross-origin frame… 在不同端口号下,不能使用传统的iframe嵌套调用方法。 document.getElementById("mainFram... iframe窗口修改元素,提示Uncaught DOMException: Blocked a frame with origin ** from accessing a cross-origin frame,无法修改 解决办法: 使用 postMessage() 方法用于安全地实现跨源通信 window.postMessage(message,targetOrigin) 方法是html5新引进的特性,可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE <iframe id="mainframe" name="mainframe" frameborder="0" src="/../**" style="overflow-x: hidden; height: 1389px; width: 1000px;" width="1912"></iframe> 显示用a标签,targ... 同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。 如果两个 URL 的protocol、port(如果有指定的话)和host都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是“元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式)。 **Blocked a frame with origin "xxx" from accessing a cross-origin frame.**最近做一个统计问题,要在A服务器向B服务器的发起请求,获取数据显示,刚开始的时候方法和jsp页面都是写在B服务器上的,直接从A服务器发请求,弹出页面就可以了,,但是后来要求做到iframe里面,再向之前那么整就直接出现了跨域的问题,网上查了些资料,现在... /*window.frames[]可以通过下标或名称访问单独的frame*/ window.onload=function(){ var h1=window.frames["header"];//.document.getElementsByTagName('h1'); alert(h1); <iframe name="web" width="100%" frameborder=0 height="0" src="http:xxx.com" id="web" onload="this.height=web.document.body.sc... 2.从编辑器中打开没有问题,但是直接在文件中打开网页,在点击一些事件时,就会出现这种问题,其实这不是跨域问题,因为都没有放到服务器上,这只是因为静态页面直接打开会存在一些问题,若是用编辑器打开页面,就不会有这个问题了。
var frame = document.getElementById('your-frame-id'); frame.contentWindow. postMessage (data, '*'); data可以是string,boolean,number,array,object 在iframe子页面 window. addEventListener ('message', function(event) { //event.data获取传过来的数据 注意:父页面的postMessage是触发addEventListener的
注意:父页面的postMessage是触发addEventListener的
参考:https://www.cnblogs.com/wangfuyou/p/6276871.html 在子页面,想使用父页面的参数,但是原因两个的域名不一样,所以会出现跨域问题 解决方法:在子页面 window.postMessage("message", '*');//后面的*号就是处理跨域问题的 然后在父页面 window.addEventListener('message', function (msg) { console.log(msg.data); 设置监听的方法就可以了 在不同的端口号,甚至是不同的ip进行iframe嵌套的时候,在父页面调用子页面的方法的时候,报错 SecurityError: Blocked a frame with origin from accessing a cross-origin frame… 在不同端口号下,不能使用传统的iframe嵌套调用方法。 document.getElementById("mainFram... iframe窗口修改元素,提示Uncaught DOMException: Blocked a frame with origin ** from accessing a cross-origin frame,无法修改 解决办法: 使用 postMessage() 方法用于安全地实现跨源通信 window.postMessage(message,targetOrigin) 方法是html5新引进的特性,可以使用它来向其它的window对象发送消息,无论这个window对象是属于同源或不同源,目前IE <iframe id="mainframe" name="mainframe" frameborder="0" src="/../**" style="overflow-x: hidden; height: 1389px; width: 1000px;" width="1912"></iframe> 显示用a标签,targ... 同源策略是一个重要的安全策略,它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档,减少可能被攻击的媒介。 如果两个 URL 的protocol、port(如果有指定的话)和host都相同的话,则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”,或者直接是“元组”。(“元组” 是指一组项目构成的整体,双重/三重/四重/五重/等的通用形式)。 **Blocked a frame with origin "xxx" from accessing a cross-origin frame.**最近做一个统计问题,要在A服务器向B服务器的发起请求,获取数据显示,刚开始的时候方法和jsp页面都是写在B服务器上的,直接从A服务器发请求,弹出页面就可以了,,但是后来要求做到iframe里面,再向之前那么整就直接出现了跨域的问题,网上查了些资料,现在... /*window.frames[]可以通过下标或名称访问单独的frame*/ window.onload=function(){ var h1=window.frames["header"];//.document.getElementsByTagName('h1'); alert(h1); <iframe name="web" width="100%" frameborder=0 height="0" src="http:xxx.com" id="web" onload="this.height=web.document.body.sc... 2.从编辑器中打开没有问题,但是直接在文件中打开网页,在点击一些事件时,就会出现这种问题,其实这不是跨域问题,因为都没有放到服务器上,这只是因为静态页面直接打开会存在一些问题,若是用编辑器打开页面,就不会有这个问题了。
参考:https://www.cnblogs.com/wangfuyou/p/6276871.html