IFRAME 要素の新しい HTML5 属性
3 つの新しい属性により、この汎用性の高い HTML 要素のセキュリティが向上します
DavidMartynHunt / Flickr / CCBY
の iframe 要素は、他の Web ページを現在のページに直接埋め込みます。HTML5HTML4 のセキュリティとユーザビリティの問題に対処するために、この要素に 3 つの新しい属性を導入します。 iframe 実装。
「サンドボックス」属性
の サンドボックス の属性 iframe 要素は、iframe の便利なセキュリティ機能です。中に入れると iframe 要素の場合、ユーザー エージェントは、サイトとそのユーザーにセキュリティ リスクをもたらす可能性のある機能を許可しません。
例えば：
|_+_|セキュリティ上のリスクとなる可能性のあるすべての機能を許可しないようにブラウザーに指示します。つまり、プラグイン、フォーム、スクリプト、アウトバウンドリンク、 クッキー 、ローカル ストレージ、および同じサイト ページへのアクセス。
次に、 サンドボックス キーワードの値、一部の機能を再度有効にします。これらのキーワードは次のとおりです。
- のリンク iframe 親ウィンドウで開きます iframe ページにはターゲット「_SELF」が設定されています。
- のCSS iframe ドキュメント全体のカスケードに追加されます。
- のルート要素 iframe ページはの子と見なされます iframe .
- の幅と高さ iframe 方法と同様の方法で設定されます その他のブロックレベルの要素 設定されます。
- スクリーン リーダーなどの音声レンダリング ツールで親ドキュメントを表示すると、 iframe 別の文書として発表せずに読まれます。
両方を設定しないでください 許可スクリプト と 同じオリジンを許可 同じキーワードを一緒に iframe .その場合、埋め込まれたページは、 サンドボックス 属性を無効にし、そのセキュリティ上の利点を無効にします。
「srcdoc」属性
の srcdoc 属性を使用すると、Web デザイナーは iframe をより詳細に制御できるだけでなく、セキュリティも向上します。別の Web ページにリンクする代わりに URL の場合、Web デザイナーは表示する HTML を iframe 内部 srcdoc 属性。
フォームなどの信頼できないソースによって作成された HTML を iframe 信頼できないコンテンツをサンドボックス化しても、ページに表示できます。ブログのコメントは一例です。ほとんどのブログでは、コメント投稿者がコメントで使用できる限られた数の HTML タグしか提供していません。しかし、それらのコメントをサンドボックス化された iframe を使用して srcdoc 属性を使用すると、サイト全体を保護しながら、コメントをより堅牢にすることができます。
セキュリティと iframe
上記の 2 つの属性により、セキュリティが確保されます。 iframe 要素ですが、すべての悪意のあるサイトに対する防御ではありません。悪意のあるサイトが、サイトの訪問者に悪意のあるコンテンツに直接アクセスするよう説得できる場合 (ブラウザに URL を入力するなど)、攻撃を受ける可能性があります。
可能であれば、サンドボックスにあるコンテンツを設定します iframe として text/html-sandboxed MIME タイプ。
「シームレス」属性
の シームレス attribute は、ブラウザーに表示するように指示するブール属性です。 iframe 親ドキュメントの一部であるかのように。あなたが望むなら iframe シームレスに表示するには、要素に次の属性を含めるだけです。
|_+_|しかし、 iframe シームレスとは見た目だけではなく、ページがフレームと相互作用する方法でもあります。いくつかのヒント：
親ドキュメントのスクリプトは、 iframe 同じように文書化します。たとえば、スクリプトがページ上のすべてのフレームをリストした場合、 iframe も記載されます。
言い換えれば、 シームレス 属性は、単に境界線を削除するだけではありません。 iframe .設定する場合 iframe シームレスにするためには、悪意のあるサイトを埋め込んで Web サイトにセキュリティ リスクを追加しないように、コンテンツを十分に確認する必要があります。