我使用Knockout.js
来绑定iframe src
标签(这将是可配置的相对于用户)。
现在,如果用户已经配置了http://www.google.com (我知道它不会加载到iframe中,这就是为什么我在-ve场景中使用它),并且它必须在IFrame中显示。但它抛出错误:-
拒绝在帧中显示'http://www.google.co.in/‘,因为它将'X- frame -Options’设置为'SAMEORIGIN‘。
我有以下Iframe代码:
<iframe class="iframe" id="iframe" data-bind="attr: {src: externalAppUrl, height: iframeheight}">
<p>Hi, This website does not supports IFrame</p>
</iframe>
我想要的是,如果URL加载失败。我要显示自定义消息。
现在,如果我使用onload和onerror作为:-
<iframe id="browse" style="width:100%;height:100%" onload="alert('Done')" onerror="alert('Failed')"></iframe>
它可以很好地加载w3schools.com,但不能与google.com一起工作。
其次:-如果我把它作为一个函数,然后像我在小提琴上做的那样尝试,它就不会起作用。
<iframe id="browse" style="width:100%;height:100%" onload="load" onerror="error"></iframe>
我不知道我应该如何让它运行并捕获错误。
编辑:-我在堆栈溢出中看到了Want to call a function if iframe doesn't load or load's问题,但它显示了可以在iframe中加载的站点的错误。
另外,我已经研究了Stackoverflow iframe on load event,谢谢!
发布于 2013-09-07 03:47:10
由于浏览器设置的Same Origin Policy,您无法从客户端执行此操作。除了宽度和高度等基本属性之外,您无法从iFrame中获得太多信息。
此外,谷歌在其响应头中设置了SAMEORIGIN的“X-Frame-Options”。
即使您对google进行了ajax调用,您也无法检查响应,因为浏览器执行了同源策略。
因此,唯一的选择是从您的服务器发出请求,看看您是否可以在IFrame中显示该站点。
所以,在你的服务器上..您的web应用程序将向www.google.com发出请求,然后检查响应以查看它是否具有X-Frame-Options头参数。如果它确实存在,那么您就知道IFrame将出错。
发布于 2013-09-01 04:57:52
我认为您可以绑定iframe的load
事件,该事件在iframe内容完全加载时触发。
同时,您可以启动setTimeout,如果iFrame已加载,则清除超时,或者让超时触发。
代码:
var iframeError;
function change() {
var url = $("#addr").val();
$("#browse").attr("src", url);
iframeError = setTimeout(error, 5000);
}
function load(e) {
alert(e);
}
function error() {
alert('error');
}
$(document).ready(function () {
$('#browse').on('load', (function () {
load('ok');
clearTimeout(iframeError);
}));
});
演示:http://jsfiddle.net/IrvinDominin/QXc6P/
第二个问题
这是因为您在内联函数调用中遗漏了括号;请尝试更改以下内容:
<iframe id="browse" style="width:100%;height:100%" onload="load" onerror="error"></iframe>
如下所示:
<iframe id="browse" style="width:100%;height:100%" onload="load('Done func');" onerror="error('failed function');"></iframe>
发布于 2017-08-04 19:05:07
onload将始终是触发器,我解决了这个问题使用尝试捕获block.It将抛出一个异常,当您尝试获取contentDocument。
iframe.onload = function(){
var that = $(this)[0];
try{
that.contentDocument;
}
catch(err){
//TODO
}
}
https://stackoverflow.com/questions/15273042
复制相似问题