如果iframe src无法加载，则会出现捕获错误。错误： - “拒绝在框架中显示'http://www.google.co.in/'。” [英] Catch error if iframe src fails to load . Error :-"Refused to display 'http://www.google.co.in/' in a frame.."

问题描述

我正在使用 Knockout.js 绑定iframe src 标签（这可以根据用户进行配置） 。

现在，如果用户已配置

现在，如果我使用onload和onerror as： -

 < iframe id =browsestyle =width：100％; height：100％onload =alert（'Done'）onerror =alert（'Failed'）>< / iframe> 
  

它可以正常加载w3schools.com但不能与google.com一起使用。

其次： - 如果我把它作为一个函数并尝试我在我的小提琴中完成，它就不起作用。

 < iframe id =browsestyle =width：100％; height：100％onload =loadonerror =error>< / iframe> 
  

我不知道如何让它运行并捕获错误。

编辑： - 我见过如果iframe在stackoverflow中没有加载或加载问题，则想调用一个函数，但是对于可以在iframe中加载的网站显示错误。

此外，我已查看加载事件中的Stackoverflow iframe
谢谢!!

解决方案

我认为你可以绑定 加载 iframe事件，iframe内容完全加载时会触发事件。

同时你可以启动一个setTimeout，如果加载了iFrame，则清除超时或者让超时触发。

代码：

  var iframeError; 
 
函数更改（）{
 var url = $（＃addr）。val（）; 
 $（＃browse）。attr（src，url）; 
 iframeError = setTimeout（error，5000）; 
} 
 
函数加载（e）{
 alert（e）; 
} 
 
函数错误（）{
 alert（'error'）; 
} 
 
 $（document）.ready（function（）{
 $（'＃browse'）。on（'load'，（function（）{
 load（'ok'）; 
 clearTimeout（iframeError）; 
}））; 
 
}）; 
  

演示： http://jsfiddle.net/IrvinDominin/QXc6P/

第二个问题

这是因为你错过了内联函数调用中的parens;尝试改变这个：

 < iframe id =browsestyle =width：100％; height：100％onload =loadonerror =error>< / iframe> 
  

进入：

 < iframe id =browsestyle =width：100％; height：100％onload =load（'Done func'）; onerror =error（'failed function'）;>< / iframe> 
  

演示： http://jsfiddle.net/IrvinDominin/ALBXR/4/

I am using Knockout.js to bind iframe src tag(This will be configurable with respect to User).

Now, if user has configured http://www.google.com (i know it won't load in iframe, thats why i am using it for -ve scenario) and that has to be shown in IFrame. but it throws error:-

Refused to display 'http://www.google.co.in/' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

I have the following code for Iframe:-

<iframe class="iframe" id="iframe" data-bind="attr: {src: externalAppUrl, height: iframeheight}">
    <p>Hi, This website does not supports IFrame</p>
</iframe>

What i want is, if the url fails to load. I want to display Custom Message. FIDDLE HERE

Now, if i use onload and onerror as:-

<iframe id="browse" style="width:100%;height:100%" onload="alert('Done')" onerror="alert('Failed')"></iframe>

It works fine loading w3schools.com but not with google.com.

Secondly:- if i make it as a function and try like i have done in my fiddle, it doesn't works.

<iframe id="browse" style="width:100%;height:100%" onload="load" onerror="error"></iframe>

I don't know how should i make it run and capture the error.

Edited:- I have seen Want to call a function if iframe doesn't load or load's question in stackoverflow but it shows error for sites that can be loaded in iframe.

Also, i have looked into Stackoverflow iframe on load event Thanks!!

解决方案

I think that you can bind the load event of the iframe, the event fires when the iframe content is fully loaded.

At the same time you can start a setTimeout, if the iFrame is loaded clear the timeout alternatively let the timeout fire.

Code:

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);
    }));

});

Demo: http://jsfiddle.net/IrvinDominin/QXc6P/

Second problem

It is because you miss the parens in the inline function call; try change this:

<iframe id="browse" style="width:100%;height:100%" onload="load" onerror="error"></iframe>

into this:

<iframe id="browse" style="width:100%;height:100%" onload="load('Done func');" onerror="error('failed function');"></iframe>

Demo: http://jsfiddle.net/IrvinDominin/ALBXR/4/

这篇关于如果iframe src无法加载，则会出现捕获错误。错误： - “拒绝在框架中显示'http://www.google.co.in/'。”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！