🪟
DOMDOMタイムス#9: windowさわるだけなら同一オリジンポリシー抵触しない説
今日は時間がないので短めでいきます(さいきんこればっか言って軽めの記事を書いてばっかかも?)。
本当に小ネタ。
同一オリジンポリシー
あるよね、同一オリジンポリシー。
ドメインが違うiframeに対して何もできないよね……
windowをぜんぶ集めたい
さて、ページ上にあるwindowをぜんぶ集めたいことがたまにありますよね。
そういうときにこんなコードを書くと、クロスドメインのiframeがページ内にあるとき例のDOMExceptionをお見舞されます。
const windows = []
const collectWindows = (wnd) => {
windows.push(wnd)
Array.from(wnd.frames).forEach((frame)=>collectWindows(frame))
}
collectWindows(window.top)
console.log(windows)
さて、落ち着いてどこでエラーが出ているのかをみてみましょう。
分解したうえでコンソールでみてみると、じつは驚くことにArray.from()
が原因であることがわかります。
じつはここでArray.from()
を使わず、for文を使えばエラーは出ません👶
(window.frames()
が返す値はインデックスによる要素取得に対応していますヨネ)
const windows = []
const collectWindows = (wnd) => {
windows.push(wnd)
const frames = wnd.frames
for (let i = 0; i < frames.length; i++) {
collectWindows(frames[i])
}
}
collectWindows(window.top)
console.log(windows)
深くは追っていないのでわかりませんが、Array.from()
は与えられたオブジェクトの中にアクセスしてしまうのでしょうかね??
おしまい。
Discussion