PTT推薦

[請益] javascript 如何跨源存取 iframe 內容

看板Soft_Job標題[請益] javascript 如何跨源存取 iframe 內容作者
alan23273850
(God of Computer Science)
時間推噓12 推:12 噓:0 →:50

如題,學校網站課程影片的連結是存在某個 iframe 裡面,

由於我想要自己寫一個 Chrome extension 存取該連結並下載它,

腳本通常是用 javascript 寫,如果是下列寫法,

iframe = document.getElementById("tool_content");

iframe.contentDocument 會因為 CORS 機制而存取不到,

想問板上各路大神是否有一個針對此問題的超強力解法?... (Q1)

此外,下載影片的方式我也想詢問,如果是右下角出現
Download
Playback speed
Picture in picture
這三者選單的畫面的話,有沒有也可以直接用 javascript 或其他等價方法的
下載方式呢?... (Q2)

上述兩個解答有效的話,都有豐厚批幣,但第一個問題較為重要,謝謝囉~

--

※ PTT留言評論
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 115.43.121.35 (臺灣)
PTT 網址

alan2327385003/12 15:55其中一個作法可能是把 console.log(iframe) 的輸出

alan2327385003/12 15:55轉成字串就能處理,但這個動作我也一直找不到解法:(

MoonCode03/12 16:08https://github.com/rndme/download

MoonCode03/12 16:10原理是仿造一個網頁元素去下載?

MoonCode03/12 16:12好像不行耶 感覺要先把 cors 相關先念熟 我先躺了

MoonCode03/12 16:19可能要從瀏覽器緩存或是網路層下手了 這有專業的人在做

s06yji303/12 16:24用postMessage和MessageEvent

alan2327385003/12 16:36回樓上,postMessage 是很多人提出的解法,但我不知

alan2327385003/12 16:36道具體要怎麼去修改校網傳來的 iframe,能加在 tag

alan2327385003/12 16:37裡面嗎?iframe 本身有辦法把自己的 content 丟出來

alan2327385003/12 16:37嗎?

stupid031903/12 17:20proxy server

alan2327385003/12 17:26回樓上,自己架的話可能可以 (不清楚細節),但如果

alan2327385003/12 17:27要作成 extension 發布,總不可能叫人家自己架一個?

wulouise03/12 17:30只是要抓影片wget不就結束了?

s06yji303/12 17:30預期是inject一個script到網頁上去取得iFrame資料

ssccg03/12 17:33要跨網域存取,一定需要你要存取的網頁配合,以你的情況來

ssccg03/12 17:35說就是script要執行在iframe裡那個網頁上,只改外面的網頁

ssccg03/12 17:36無論如何都是不行的(否則就是瀏覽器需要修補的安全性漏洞)

alan2327385003/12 17:37回覆 @s06yji3,我不確定 Chrome extension 能否這

ssccg03/12 17:37但是你是extension,所以應該是直接inject script到iframe

alan2327385003/12 17:37樣做?然後 @ssccg 大,我有嘗試過 disable Chrome

alan2327385003/12 17:38的 CORS 限制,但是那個在網頁重整之後就會失效了。

ssccg03/12 17:38裡面那個網頁去配合

alan2327385003/12 17:38Chrome extension 可以 inject script 到本地網頁去

alan2327385003/12 17:39撈那個 iframe 的內容,然後再回傳到自己的script嗎

ssccg03/12 17:43content_scripts/#frames

alan2327385003/12 17:50謝謝樓上,看起來可以用上,但我這兩天爆試已經很累

s06yji303/12 17:54哦,好像inject到iframe 比較直接

alan2327385003/12 17:54所有的 nested iframe 也可以 inject 嗎?

MarcoReus03/12 19:16如果iframe 網址已知 我會用background script 直接去

MarcoReus03/12 19:16撈 @@

MoonCode03/12 19:23乾好猛 學習到了

MoonCode03/12 19:23阿 我還是看不懂 等原po 實驗成功回來教教我QQ

alan2327385003/12 21:43有兩個都是 <iframe src="about:blank" ...,但我只

alan2327385003/12 21:43要其中一個,這樣有辦法嗎?

superpandal03/12 22:23這東西之前弄過 但安全起見還有更好的方式

superpandal03/12 22:23

alan2327385003/13 00:15回樓上,如果是自己寫的腳本應該沒有安全顧慮?求解

superpandal03/13 00:34這方式本來就有安全疑慮 無關是不是自己寫

superpandal03/13 00:35寫 不硬要可以更安全

superpandal03/13 00:38至於自己寫的可以寫的更絕一點

Arctica03/13 12:36直覺要透過前端做就是會被browser擋

alan2327385003/13 12:52@superpandal 想請問大大有實際範例可以參考嗎?

MarcoReus03/13 13:34原po能提供你的iframe 格式嗎?

superpandal03/13 17:23在公司弄的 現在也沒空 在研究其它的

superpandal03/13 17:31你多看mdn 再實作一下不就懂了...

alan2327385003/13 18:53Marco大 https://imgur.com/T9VuDsg 這張圖可以嗎?

Hsins03/13 21:54src="about:blank" 的話,找看看是不是有某段 JS 生出來的

Hsins03/13 21:55還是 server-side 本身就故意要這樣塞,前者的話可以直接

Hsins03/13 21:55找到資源網址吧

Saaski03/13 22:03某s就是在嘴砲而已,他平常回文就那樣,不用理他

alan2327385003/13 22:18回 @Hsins,這目前對我來說是 undecidable 問題哈哈

alan2327385003/14 01:44而且是有兩個 iframe 的 src 都是 about:blank,但

alan2327385003/14 01:44我只要其中一個,這樣也行嗎?

MarcoReus03/14 19:21我猜你的iframe 內容是其他js塞的 看一下network 的req

MarcoReus03/14 19:21uest 有沒有你要的關鍵字

alan2327385003/14 23:59我好像找到解法了!!!大致上是去篩 server 送來的

alan2327385003/14 23:59response body 裡面出現的影片 url,詳細解法等我

alan2327385003/14 23:59實作完之後再上來告訴大家!獎金的發放也是。

qq121703/15 00:05期待解法