問 保護されたコンテキスト(Secure Contexts)

混在コンテンツ(mixed contents)は、HTTPSのページでHTTPのコンテンツを読み込んでいること。HTTPのコンテンツは盗聴や改ざんができてしまうので、混在コンテンツのWebページは安全に保護されていない状態だよ。

それに対して、保護されたコンテキスト(Secure Contexts)は、一定のセキュリティの基準を満たしているもの。
保護されたコンテキストのWebページは、安全に保護されている状態といえるよ。

セキュリティの基準には、下のようなものがある。

Service Workerなど、保護されたコンテキストのWebページではないと実行できないAPIがある。セキュリティ上の安全を守るため、HTTPSまたはlocalhostで動かすことが条件になっているよ。

また、isSecureContextプロパティを使用すると、そのWebページが保護されたコンテキストかを調べることができる。

isSecureContextプロパティを使用したサンプルコードはこちら。

sample変数に、windowオブジェクトのisSecureContextプロパティ、つまり保護されたコンテキストかを調べた結果を格納している。それをconsoleオブジェクトのlogメソッドで、コンソールに出力しているよ。

F12キーを押して、コンソールでサンプルコードを実行すると、trueかfalseが返ってくる。

trueが返ってきたら、そのWebページは保護されたコンテキストである。

falseが返ってきたら、そのWebページは保護されたコンテキストではない。

そのため、HTTPSのページの中にローカルのコンテンツがある、Service Workerは保護されたコンテキストでなければ実行できない、isSecureContextプロパティがtrueの3つが正解。

HTTPSのページの中にHTTPのコンテンツがある、isSecureContextプロパティがfalseの場合は保護されたコンテキストではないので、それら2つは不正解。