Same Origin Policy心得整理

最近被一個朋友念。問我這一年來做了什麼。感覺什麼都說不上來，但認真想了一下，這一年來也是做了很多學習、很多嘗試，也有了很多心得。這些零零碎碎的東西，如果不特別記錄下來，恐怕真的會覺得自己什麼都沒做。

即然如此，我就把最近做的一些學習留在這裡做分享吧。

===========

何謂Same Origin Policy？

https://www.w3.org/Security/wiki/Same_Origin_Policy
https://developer.mozilla.org/zh-TW/docs/Web/Security/Same-origin_policy

Same Origin Policy即同源政策。簡單的說，是現代瀏覽器增加的一種安全政策。要求瀏覽器確保網頁中不同來源的腳本與資源不會被交互存取。

其實在早期的瀏覽器中，是否能交互存取不是重要議題。因為當時的網頁技術還不夠強大、成熟，因此比較沒有注意到這個東西。交互存取反而讓網頁腳本的開發變得更為彈性...或是混亂。想得到的，就是保護各網站間的Cookie。

很快的，駭客們發現了跨站腳本攻擊(XSS)與各種新型態的XSS(比如跨站請求偽造(CSRF))攻擊。能利用交互存取的方便性從瀏覽網頁的羔羊身上偷取資料。駭客們只要設法讓自己的腳本被受害者讀取到，接下來就等於控制了羔羊的瀏覽器。此外，隨著網頁技術的成熟，新興的網頁技術讓網頁程式、腳本變得強大，這更助長了駭客的力量。一個強大的瀏覽器被控制了，就表示使用者的電腦或裝置也可能被控制。

XSS簡單的說就是駭客拿某個第三方的網站當跳板，讓瀏覽該網站的使用者執行到駭客的腳本，然後進行進一步的攻擊。實例就像是十幾二十年前的Javascript炸彈。駭客(這麼low，應該是怪客)，在留言板裡面留下一個Javascript，不斷的跳出警告或是新視窗。然後使用者讀到這個留言的時候，就會被不斷出現的警告或是新視窗搞到煩，甚至是瀏覽器或是電腦當機。

CSRF則是讓使用者讀到駭客更複雜的腳本。腳本的內容可能是呼叫銀行做轉帳。如果被害人正好通過了網路銀行的登入，那麼網路銀行可能會無法分判這個轉帳的請求是駭客的腳本發的？還是被害人發的？因為請求都來自同一個(被害人)、登入過的瀏覽器！(各位不用擔心使用網路銀行。這種攻擊已經行之有年。銀行大都已經有防範機制)

上述的兩類攻擊都有一個特點，就是要讓被害人讀到腳本並執行腳本。駭客的腳本被執行後，被害人瀏覽的網頁的內容根本是雙手奉上。

而同源政策(Same Origin Policy)的實行大幅度的減少這種情況的發生。理由是駭客要把讓被害人執行攻擊腳本是有一定難度的。首先是駭客要設法把腳本搬進中介網站，然後中介網站將腳本展示到被害人的瀏覽器。然而中介網站絕不會輕易的加進來路不明的腳本。同時，許多中介網站也開始檢查輸入的資訊，避免前述Javascript炸彈的情況發生。

這使得駭客只能從其他地方進攻。比如在現代瀏覽器多頁籤的功能下，從A頁攻擊B頁。這種場景通常是A網站的資安比較弱(或甚至是駭客自營的)，然後透過瀏覽器內部資源共享的功能(漏洞)和不同的頁籤做資源的交換。

這種情境下，駭客的腳本與中介網站將被瀏覽器認為是不同來源。因此可以切斷兩者之間的交互作用。進而保護網頁的使用者。

Same Origin Policy的影響

在同源政策的影響下，不同來源的資源、腳本，不會互通有無。瀏覽器負責將非法的存取擋下來。我們也經常可以看到Chrome、Firefox在做安全更新。有一些就是白帽駭客們找到了可以突破同源政策的手段。

然而，同源政策也會降低腳本的彈性。這要怎麼處理呢？底下有做一些說明。

突破Same Origin Policy

https://stackoverflow.com/questions/3076414/ways-to-circumvent-the-same-origin-policy

有一些應用會需要在不同源的腳本或網頁間互取資料。解決方案分兩類：宣告放棄同源保護，以及走其他通道。

如何放棄同源保護
https://developer.mozilla.org/zh-TW/docs/Web/HTTP/CORS

在Http Header裡面增加「Access-Control-Allow-Origin」。這招叫CORS。

不是單純加上去就可以運作的。詳細可以自己Google查詢。或是看我上面提供的連結。

如何走其他通道突破同源保護

https://hackmd.io/s/H1cY3TTYe#
https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

基本上就是用各種方法「間接」的去存取不同源的資源。比方A站的腳本把資源或狀態打到C站；B站的腳本則到C站去取。如果是指令的話，可以改成A站的腳本監聽C站是否有人下了命令。然後B站的腳本發命令到C站。

上面這招可行。但其實有一些更輕便的「定石」可以用。比如postMessage。postMessage就像是網頁頁面裡的Message Queue。開發人員可以透過丟Event到Queue裡面，或是監聽Queue裡面的Event進行兩個站的資源或腳本交互作用。同源政策似乎是認為Message Queue的操作與管理應該是開發人員自己能控制的，所以沒有強加管控。開發人員應自行控制什麼腳本可以被Event驅動、什麼資源可以因Event露出。

中田永一 (乙一) - 吉祥寺的朝日奈君

這部作品是和《百瀨，看我一眼》同時拿到的。自從推薦朋友乙一的《斷掌事件》之後，成功的把朋友推入火坑，變成乙一迷。現在追乙一的作品追的比我更勤。

《吉祥寺的朝日奈君》是乙一化名中田永一的另一部作品。故事內容的氣氛比用乙一的名號寫的作品來說輕鬆許多。感覺得出來乙一換名字出版，一個目的就是不希望讓他的筆名把故事綁架，這樣的做法讓購買本作的讀者們更不會有不合理的預期。

《吉》裡面是五篇青春揚溢的短篇小說。 其中四篇的主人翁是國高中生。內容幾乎是一些淡淡的男女愛戀關係。即使是化名中田永一，乙一也會在作品埋下伏筆，讓讀者在唸到最後心裡扯那麼一下。

本作的書名用的是裡面其中一個短篇的篇名。『吉祥寺的朝日奈君』正是我最喜歡的其中一篇。比起《百》以及《吉》裡面的其他短篇，這部故事比較不是純愛的走向，在下卻看得最興奮，莫非是到了危險的年齡！？總的來說『吉』就像比較健康的《失樂園》；又或是比較清純的《晝顏》(日劇)。內容有點「不倫」，而且也如《失》及《晝》那般，故事中的兩人在各種因緣下起了相互的純愛，而不是兩個愛跑夜店尋求刺激的玩咖。雖然經常看乙一書寫一些沒血沒淚的變態，沒想到表現起禁忌的愛也是非常令人有感覺。竟然像看《晝》一般，莫莫為這段禁忌的愛感到捥惜。

另一部短篇《開始交換日記！》則用上了有點像《長腿叔叔》的結構。採用不連續的方式構建故事主體。張力雖然比不上《長》那樣的經典大作，但是這個挑戰算是很成功。相信讀者在閱覽的時候也不會因為不連續的結構而無法融入。

《吉吉祥寺的朝日奈君》是乙一化名中田永一的作品裡面，目前我覺得最好的一本(不過我也才看兩本而已)。如果喜歡乙一、好奇乙一推出了什麼樣的作品，我想選擇本作會是最佳抉擇。

東野圭吾 - 虛像的丑角

這部作品收錄了東野圭吾七個短篇推理小說，主角是前幾年非常出名的「伽利略」湯川學。從維基百科的資訊來看，是把日本出版的兩部單行本整理成一本在台販售。個人非常喜歡東野圭吾的伽利略系列。但是我還是得說自己被本作騙了。本作的內容和幾年前上映的日劇「偵探伽利略」裡的內容完全一樣。這讓期待新作的我感到有些受騙。而在閱讀的同時，腦海裡也時常浮現福山雅治的尊容。

湯川學是一名大學副教授，專門的領域是物理學，綽號「伽利略」。從電視劇來看，湯川老師的學習範圍真是無邊無境的廣。但仔細想想，唸書的時候教授說到，碩士是研究的深，博士是研究的又廣又深，所以湯川大大這麼殺也是合理的。畢盡現代科學的突破，往往是多個領域間交互學習的成果。

伽利略感興趣的事件是常人認為無法解釋的現象。雖然一般人無法解釋，但是在伽利略老師的眼中卻不見得無解。然而，雖然伽利略不喜歡和科學無關的案件，但是只要事件到他身旁，似乎都還是願意協助，有些悶騷。


在《幻惑》這篇，主角面對的是使用念力殺人的事件。犯人老實的自首了。但是強調自己是用念力殺人。在《心聽》的故事裡，一間公司裡有多個人出現了幻聽。這究竟是巧合還是有別的原因？《透視》這部談到一位有透視能力的陪酒女。主角當然不相信「透視」這種事囉。而《念波》的故事討論了雙胞胎心電感應的神祕現象。分隔兩地的雙胞胎妹妹竟然看到了百里之外殺害姊姊的兇手的模樣。

這些「很有趣」的事件背後有著什麼樣的真相？雖然看小說也不錯，但我更推薦各位去看看日劇。那個畫面感更有意思。

松本清張 - 黑色樹海

這部作品和之前《買地方報紙的女人》一樣，是在某stream TV看的。原本沒什麼期待，因為《買》雖然有田村正和以及廣末涼子的演出，給我的感覺卻不算好看，所以在看本作時，心裡是有些不願意的。不過，本作確實好看多了。網路上的評價也都高於前作。以戲劇來說，確實比較能讓觀眾覺得有趣。

主角（北川景子）和姊姊相依為命。某日，姊姊出了遠門後竟車禍客死異鄉。主角被通知領回姊姊的遺體。隨之而來的卻是愈來愈多的謎團。姊姊的遺物為什麼隔這麼久才找到？為什麼姊姊會去那裡？車禍的地點根本不在和姊姊出門時說的目地的的途中。為什麼姊姊有換坐位的跡象，換坐位的原因又是什麼？隨著接替姊姊的工作，主角也知道愈來愈多姊姊的人際祕辛。事件的關係人也都紛紛出現了。

這個故事用一個事件說明了，即使是親密的姊妹，卻仍然會有許隱藏的祕密。就像女主角也不知道姊姊許多的私生活一樣。是松本大師一貫探討社會與人性的一種隱喻。

本作的女主角北川景子演的非常好。讓人能輕易的融入故事之中。北川景子這幾年進入了成熟期，有愈來愈多以他為女主角的好作品不斷的登場。我想，這部作品，光是滿足她的戲迷就很足夠了。

最後，雖然松本清張是社會派的大師，但是推理小說的驚奇要素還是掌握的很好。故事的最後，真相就以令人驚訝的方式呈現了出來，相當有趣。而本作的故事也安排的很好，相信觀眾們會喜歡。