66

WebブラウザはiframeのJavaScriptに個別の実行スレッドを使用しますか?

Chromeはタブごとに別々のスレッドを使用していると思うので、iframe内のJavaScriptはその親ウィンドウと同じスレッドを共有すると思いますが、それもセキュリティ上のリスクのようです。

4

10 に答える 10

33

最近、iFrameで実行されているJavaScriptが親ウィンドウでのJavaScriptの実行をブロックするかどうかをテストしました。

親と同じドメインのiFrame:

  • Chrome 68.0.3440.84:ブロック
  • Safari 11.0.2(13604.4.7.1.3):ブロック
  • iOS上のSafari15.1:ブロック
  • Firefox 96:ブロック

親として別のドメインのiFrame

  • Chrome 68.0.3440.84:ブロックしません
  • Safari 11.0.2(13604.4.7.1.3):ブロック(時代遅れですが、MacBookを持っていません)
  • iOS上のSafari15.1:ブロックしません
  • Firefox 96:ブロックしません
  • Chrome for Android 96:ブロックする場合とブロックしない場合があります(Chrome for Androidには、プロセスを分離する場合と分離しない場合を決定する複雑なルールがいくつかあります。を参照chrome://process-internalsしてくださいchrome://flags

parent.html:

    <body>
    <div id="count"></div>
    <iframe src="./spin.html"></iframe>     
    <script>
        let i = 0;
        let div = document.getElementById("count");
        setInterval(() => {
            div.innerText = i++;
        }, 100);
    </script>
    </body>

spin.html:

    <body>
    <button id="spin">spin</button>
    <script>
        const spin = document.getElementById("spin");
        spin.addEventListener('click', () => {
            const start = Date.now();
            while (Date.now() - start < 1000) { }
        })
    </script>
    </body>
于 2018-08-05T11:03:45.853 に答える
23

Chromeが登場する前は、どのブラウザのすべてのタブも同じJavaScriptの単一スレッドを共有していました。Chromeはここでゲームを強化し、他の何人かはそれ以来それに続いています。

これはブラウザの実装の詳細であるため、確実な答えはありません。古いブラウザは間違いなくそうではありません。iframeに別のスレッドを確実に使用しているブラウザは知りませんが、正直なところ、実際に調べたことはありません。

スレッドの実行に伴ってオブジェクトが持ち込まれないため、セキュリティ上のリスクはありません。

于 2012-07-16T18:47:28.063 に答える
22

他の答えを要約すると:いいえ、iFrameは通常メインページと同じスレッド/プロセスで実行されます

ただし、Chromiumチームはこの分野でさらなる隔離に取り組んでいるようです。

Chromium Issue 99379:プロセス外のiframe [申し訳ありませんが、リンクが機能していません-機能する問題へのリンクが見つかった場合は、お知らせください]

アウトプロセスiframeの設計計画

于 2014-03-13T02:18:39.767 に答える
12

私は今夜​​、既存の答えをチェックする前に、同じ質問をしました。私が現在取り組んでいるプロジェクトでは、別のフレームワークを使用するiFrameをロードする必要があり、そのiFrameが何らかの形でスレッドをブロックしてアプリに影響を与える可能性があるかどうかは好奇心旺盛でした。答えはイエスです、それは可能です。

私のテストはChromeで行われました。親に子iFrameをロードしました。親では、毎回テキストをconsole.logに記録する間隔を設定しました。次に、iFrameでタイムアウトを使用して、スレッドをブロックする「while」を起動しました。答え:iFrameは同じスレッドを使用します。

例:

親の場合:

setInterval(() => {
  console.log('iFrame still using the thread');
}, 3000)

iFrameの場合:

setTimeout(() => {
  console.log('now the thread is not working in the iFrame anymore');
  while (true) {
  }
}, 10000)
于 2016-08-03T23:32:50.070 に答える
6

デスクトップ(モバイルではなく)上のchromeとfirefoxのみがスレッドを分離しています。

メインページで間隔を空けて長いループを実行し、メインページとiframeの両方にアニメーションを表示する小さなページを作成しました。確認したいブラウザからサイトにアクセスできます。

下のアニメーション(「クロスオリジン」の下)が停止せずに実行される場合は、別のスレッドがあります。

https://eylonsu.github.io/browser_thread/

于 2020-06-23T08:46:41.740 に答える
5

これは遅いですが...良い点です。Firefox16ではiframejsが同時実行されているようです。
アラート機能(ブロック)を試してみると、ダイアログが一緒に開いているのがわかります。
ChromeやIEでは表示されません。
iframejsは通常どおりFirefox16の親ウィンドウにアクセスする可能性があるため、競合状態が発生する可能性があると考えられます。

于 2012-11-19T15:57:06.013 に答える
5

今日、UbuntuのChrome28でこれを試してみました。このコマンドを使用して、Chromeのスレッドとプロセスを確認しました

ps axo pid,nlwp,cmd | grep "chrome"

Chromeはiframeの新しいスレッドやプロセスを生成しないようです。興味深いことに、開発ツールペインに新しいプロセスが生成されます。

于 2013-06-20T18:31:00.967 に答える
5

2021年の更新:

Origin-Agent-Clusteriframe専用のリソースをリクエストできるヘッダーが追加されました。現在、Chrome(88+)でサポートされており、MozillaとSafariから好評を得ています。

Origin-Agent-Clusterは、同じサイトのクロスオリジンページ間の同期スクリプトアクセスを防ぐようにブラウザに指示する新しいHTTP応答ヘッダーです。ブラウザは、オリジンが専用プロセスなどの独自の個別のリソースを取得する必要があることを示すヒントとして、Origin-Agent-Clusterを使用する場合もあります。

[...]たとえば、https://customerservicewidget.example.comビデオチャットに多くのリソースを使用することが予想され、全体のさまざまなオリジンに埋め込まれる場合https://*.example.com、そのウィジェットを維持するチームは、Origin-Agent-Clusterヘッダーを使用して、パフォーマンスへの影響を減らすことができます。埋め込み。

Origin-Agent-Clusterヘッダーを使用するには、次のHTTP応答ヘッダーを送信するようにWebサーバーを構成します。Origin-Agent-Cluster: ?1の値?1は、ブール値のtrue値の構造化ヘッダー構文です。

詳細はこちら:https ://web.dev/origin-agent-cluster/

于 2021-02-03T18:54:47.770 に答える
0

2022アップデート(実験的)

Iframeは、デスクトップコンピューターの少なくともChrome Canaryで並行して実行できるようになりましたが、これはまだ実験段階です。

  1. Chrome Canaryをダウンロードします(https://www.google.com/chrome/canary/)。
  2. 「chrome://flags/」に移動します。
  3. 「分離されたサンドボックス化されたiframe」を有効にします。
  4. 次の内容で「index.html」を作成します。
<h1>index.html</h1>
<iframe src="index-child.html" sandbox="allow-scripts"></iframe>
<script>
    setInterval(() => {
        console.log("index.html executed one iteration");
    }, 1000)
</script>
  1. 次の内容で「index-child.html」を作成します。
<h1>index-child.html</h1>
<script>
    setTimeout(() => {
        console.log("index-child.html started continuous execution");
        while (true) {
        }
    }, 3000)
</script>
  1. ブラウザで「index.html」を開きます。
  2. コンソールが「index.htmlが1回の反復で実行されました」と一貫してログに記録されていることを確認します。したがって、iframeは並行して実行されます。
  3. 「分離されたサンドボックス化されたiframe」を無効にして(または単に別のブラウザを使用して)、「index.html」を再度開きます。コンソールは、「index.htmlが1回の反復で実行されました」を一貫してログに記録しなくなりました。したがって、iframeは並行して実行されなくなります。

:これを機能さsandboxせるには、タグの属性をiframe正しく設定する必要があります。さらに、現在サポートされている追加のプロセスはサイトごとに1つだけです。つまり、複数のiframeがすべて並行して実行されるわけではありません。

「chrome:// flags /」からの具体的な手順:

分離されたサンドボックス化されたiframe
有効にすると、「sandbox」属性があり、その属性に「allow-same-origin」権限が設定されていないiframeにプロセス分離が適用されます。現在の分離モデルでは、特定のサイトのすべてのサンドボックス化されたiframeが同じプロセスに配置されますが、将来の実験で代替モデルが導入される可能性があります。– Mac、Windows、Linux、Chrome OS、Fuchsia

于 2022-02-25T23:39:04.387 に答える
-1

iFrameの場合、いいえ。ただし、JavaScriptでスレッドを使用する場合は、新しいブラウザーでサポートされているhtml5ドラフトであるWebワーカーを使用できます。http://www.w3.org/TR/2009/WD-workers-20091029/

于 2013-03-06T07:53:10.990 に答える