Skip to content

Instantly share code, notes, and snippets.



Last active Jun 3, 2018
What would you like to do?
Safari TP 57のCross-Origin-Options HTTP response headerについて

Release Notes for Safari Technology Preview 57 | WebKitCross-Origin-OptionsというHTTP response headerの実験的サポートが行われた。

  • Added initial support for the Cross-Origin-Options HTTP response header (r231622, r231654)
  • Changed Cross-Origin-Options:deny and Cross-Origin-Options:allow-postmessage to prevent getting navigated by cross-origin scripts (r231911)



チェンジセット 231622 – WebKitに概要が書かれている。

Add initial support for 'Cross-Origin-Options' HTTP response header behind an experimental
feature flag, on by default. When the HTTP server services this HTTP response header for a
main resource, we'll set these options on the corresponding Document. This will impact the
behavior of the Document's associated Window API when cross-origin.

The HTTP header has 3 possible values:

allow: This is the default. Regular cross-origin Window API is available.
allow-postmessage: Only postMessage() is available on a cross-origin window, trying to
access anything else will throw a SecurityError.
deny: Trying to do anything with a cross-origin window will throw a SecurityError.

Cross origin Window間でのアクセスをHTTPヘッダによって制限できる仕様。 Same originならば特に制限はない。


  • allow: 今のデフォルトなので制限なし
  • allow-postmessage: window.postMessageでのアクセスは許可
  • deny: すべてSecurityErrorとする


例えば、window.openerはcross originの成約を受けずにアクセスできるプロパティだったりする。 (ただしopenernoopenerをつけるとアクセスできなくなる。リンクのへの rel=noopener 付与による Tabnabbing 対策 | )

iframe.contentWindow、window.parent、、window.opener といった JavaScript API を用いると、ドキュメントが直接互いに参照することができます。 同一オリジンポリシー - Web セキュリティ | MDN

denyの場合次のような別originのwindowプロパティへのアクセスをSecurityErrorとして例外をなげるようになる。 allow-postmessageの場合はpostMessageだけは許可される。

const crossOriginPropertyNames = [ 'blur', 'close', 'closed', 'focus', 'frames', 'length', 'location', 'opener', 'parent', 'postMessage', 'self', 'top', 'window' ];
76	const forbiddenPropertiesCrossOrigin = ["name", "document", "history", "locationbar", "status", "frameElement", "navigator", "alert", "localStorage", "sessionStorage", "event", "foo", "bar"];


役割的には一括でホワイトリストで制限するような役割のCross-Origin-Optionsという印象。 でも、sandboxとかFeature Policyとかもすごい役割が似ている気がするけど、どういう経緯で実装されたのかはよくわからなかった。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment