0

配列から URL を取得し、それらを次々と iframe に配置するスクリプトがあります。

<script type="text/javascript">
    $(document).ready(function () {
        var array = ['http://www.example1.come', 'http://www.example2.com', 'http://www.example3.com'];
        var beforeLoad = (new Date()).getTime();
        var loadTimes = [];
        $('#1').on('load', function () {
            loadTimes.push((new Date()).getTime());
            $('#1').attr('src', array.pop());
            if (array.length === 0) {
                $.each(loadTimes, function (index, value) {
                    $("#loadingtime" + index).html(value - beforeLoad);
                });
            }
        }).attr('src', array.pop());
    });
</script>

私の問題は、「google.com」や「youtube.com」のような URL を入力すると、ロードされないため、他のソースがスタックしてロードされないことです。google.com をソースとして iframe に入れようとすると、Chrome コンソール モードで次のエラーが発生します。Refused to display 'http://www.google.com/' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'.

このエラーが発生してロードされないURLリストにそのようなURLがある場合、そのURLをスキップして代わりに次のURLをロードするようにするにはどうすればよいですか? タイムアウトなどを設定できますか?

4

2 に答える 2

1

残念ながら、これはクリックジャッキングを防止するセキュリティ機能であるため、このエラーを取り除くことはできないと思います。

詳細については、MDNを参照してください。それによると、X-Frame-Options ヘッダーは現在、すべての主要なデスクトップ ブラウザーでサポートされています。

試してみるべきいくつかのアイデアがあります。

  1. あなたのコードは Firefox (Firefox Nightly、2013-01-06) で動作するようです。ブラウザーを変更できる場合は、試してみてください。
  2. Ajax を使用すると、iframe.src 属性を変更する前に Web サイトのヘッダーを確認できます。ヘッダーの 1 つが「X-Frame-Options」の場合、別の URL に進むことを選択できます。
    もちろん、この方法を使用するとCORSに出くわしますが、この機能はFirefoxとChromeの両方で無効にすることができます。
    明らかに、あなたの場合、Ajax を介して Web ページをロードし、そのロード時間を測定することはあまり良い考えではないようです。ただし、ルート 1 の代わりにサブページ (「http://youtube.com/SOMETHING」など) を読み込んで、測定対象がキャッシュされないようにすることもできます。
于 2013-02-28T06:29:41.607 に答える