關於Web的同源政策(Same Origin Policy)

閱讀時間約 5 分鐘
互聯網的時代中我們幾乎都離不開網路,那如果能夠對於Web具備基礎的知識,就能夠讓我們在使用網路的過程中提升風險意識,以減少被竊取、盜用的風險,進而保護個人資產,因此多一份知識在身上也就等於多了一份防身的武器,一天學一點,透過微習慣讓我們享受複利的效應。
Same-Origin Policy 同源政策是Web Security中安全建立的基礎,用來限制不同網域之間的資源存取權,而這邊指的資源包括程式碼、圖片、影片、html…等。
Same-Origin Policy 主要目的在劃清界限,試想兩個國家之間,基於安全考量,通常不會共享重要資源(軍備、財務…等)吧! 而Same-Origin Policy就是在制定這樣的政策,讓自己的網站自己管,試想,若自己的網站允許被其他網站存取,那麼在你的網站中的重要資訊也很容易被竊取,甚至鑽研漏洞,導致被攻擊,道理就跟國與國之間一樣,必須形成壁壘,保護重要資產。
像這樣的畫面,我們進行網頁開發時是不是常常看到這種狀況? 這就是不同源存取的其中一個例子。

什麼是同源? 又該如何判定?

同源(Origin)主要由以下三個部分組成:
  • Schema: URL的最初始位置,也就是:// 之前的字段,也就是http、https...等協定。
  • Hostname(Domain): 這裡指的就是full domain name。
  • Port: domain name後面接的port, 我們有時候沒有看到port號是因為http預設80 port而https預設為443 port。
上述三個部分只要有其中一個不相符,就屬於不同源,以下用簡單的例子來看看哪些同源,哪些又是不同源?
❓ <https://www.domain1.com>

====================================================================

✅ <https://www.domain1.com/dir1/1.html>

✅ <https://www.domain1.com/dir1/inner/1.html>

❌ <http://www.domain1.com> -> Schema不同

❌ <https://www.hack.com> -> Hostname不同

❌ <https://www.domain1.com:31217> -> Port不同

哪些又是同源的例外?

開發Web應用的過程中,我們常常會嵌入其他網站的圖片、內嵌網頁、影片…等,但問題來了,為什麼這些資源能夠順利的被嵌入呢? 沒錯,事情總有些例外!在某些情況下,跨源是被允許的,如下:
  • 跨來源寫(Cross-origin writes): 連結、重新導向、表單送出。
  • 跨來源嵌入(Cross-origin embedding): <script src=”xxx”>、 <img>、<video>、<iframe>…等嵌入語法。

關於Cookie存取的同源政策

什麼是Cookie呢? 簡單來說就像一張通行證的概念,裡面存有你這個人的識別號碼, 因此通常是認卡不認人,因此很容易發生非本人但拿著識別卡片一樣能進入的狀況。
為什麼會如此呢? 這就得先了解一下Cookie的同源政策,對於Cookie的檢查來說,只要Hostname(Domain)與Path一樣,就會被視為同源,若Cookie有加上一些特別的設定才需要多判斷Schema的部分。
而Cookie的子網域與母網域是共用的,因此有心人士可以在這樣的共用制度下,透過子網域去攻擊母網域,導致安全性議題,後續會談到CSRF,看完之後就能呼籲這篇的概念了。

結語

同源政策的概念非常好,完美的形成壁壘,但總不可能為了完全阻絕攻擊而封閉整個國家吧! 並不是每個想要存取網站的其他來源都是惡意的,而我們有時候也需要串接一些第三方的資源,套用到國與國之間就是邦交國的概念,總會需要一些適度的開放,那開放的同時也需要有一些名單上的限制,另外會衍生哪些安全性議題? 請參考以下的章節預告。

章節預告

資源參考

即將進入廣告,捲動後可繼續閱讀
為什麼會看到廣告
109會員
250內容數
哈囉,我是阿Han,是一位 👩‍💻 軟體研發工程師,喜歡閱讀、學習、撰寫文章及教學,擅長以圖代文,化繁為簡,除了幫助自己釐清思路之外,也希望藉由圖解的方式幫助大家共同學習,甚至手把手帶您設計出高品質的軟體產品。
留言0
查看全部
發表第一個留言支持創作者!
阿Han的沙龍 的其他內容
何謂DAO? 🔔 傳送門: 一起加入Potato Media 共創Web3.0部落格生態圈吧 🔔 去中心化(Decentralized) 自治(Autonomous) 組織(Corporations) DAO與傳統企業不同之處 傳統組織 官僚體系。 程序非公開透明。 權力集中。 去中心化組織
會談這個主題主要是工作上預計進行Pair Programming的模型來開發,因而蒐集了一些關於Pair Programming這方面的相關概念與執行方向,並整理讓大家共同參考、討論。 🔔還沒成為Potato會員的朋友點這裡加入哦,撰寫文章還能挖礦打造被動收入 🔔 優點 提升程式碼品質 缺點
何謂DAO? 🔔 傳送門: 一起加入Potato Media 共創Web3.0部落格生態圈吧 🔔 去中心化(Decentralized) 自治(Autonomous) 組織(Corporations) DAO與傳統企業不同之處 傳統組織 官僚體系。 程序非公開透明。 權力集中。 去中心化組織
會談這個主題主要是工作上預計進行Pair Programming的模型來開發,因而蒐集了一些關於Pair Programming這方面的相關概念與執行方向,並整理讓大家共同參考、討論。 🔔還沒成為Potato會員的朋友點這裡加入哦,撰寫文章還能挖礦打造被動收入 🔔 優點 提升程式碼品質 缺點
你可能也想看
Google News 追蹤
Thumbnail
本專欄將提供給您最新的市場資訊、產業研究、交易心法、精選公司介紹,以上內容並非個股分析,還請各位依據自身狀況作出交易決策。歡迎訂閱支持我,獲得相關內容,也祝您的投資之路順遂! 每年 $990 訂閱方案👉 https://reurl.cc/VNYVxZ 每月 $99 訂閱方案👉https://re
最近有一些新的覺察,邁入大學的生涯後,更加的明白,有很多的事情需要自己去體會、感受。才能找出屬於自己的最佳解。 大學就是一個小型的社會,多少時間是社交,又多少時間是留給自己,是一個流動的狀態,卻是大部分會給我帶來情緒波動的主因。 最近感悟到,當我在面對與自己完全不同的人時學到了如果對方沒有主動問
在棋盤的每一角落,棄子不僅是一種策略,更是一門藝術。
Thumbnail
不純粹的閱讀,你必然得到純粹的結論,例如看到討厭的同學發臉文,心裡開始品頭論足,最後得出他失戀失業的無能結論。嗯,或許討厭的同學只是單純實驗做失敗而已。 這年代了解不純粹的純粹很重要,還記得2024總統大選,有許多工程師小草放大自己的專業能力,覺得別人都很笨,用極大的意義解讀其他政治人物的動機?
Thumbnail
畢業季,離情依依,怕感情變疏遠!送別禮物特別能延續感情,但要送什麼好呢?讓友情歷久彌堅,分享好朋友送禮攻略!好書推薦「長輩沒教,但你一定要懂的81種送禮大學問」!
Thumbnail
之前研究Google簡報的時候,發現Google簡報並沒有提供畫筆工具、開啟YouTube影片時也沒辦法在影片上直接畫圖寫字。所以這次找了一個Chrome的外掛程式 Web Paint。功能非常簡單,趕快跟著圖卡操作看看吧!
我保證我會專門寫一些專門針對分子 ARweb 的帖子,描述我們是如何製作它的,以及教師如何在課堂上使用它!目前,教師可以查看這篇論文或預印本。 AR 在科學教育中的應用不僅限於查看分子。Google 提供 WebXR 體驗來觀察各種化學和生物學學科(植物、細胞、動物等)的帶註釋(在某些情況下是動畫)
Thumbnail
門市通路很不喜歡Show-rooming(展聽現象),透過重建OMO顧客旅程,可以讓Show-rooming的消費者的線上消費,可以歸因回某門市的服務,並讓門市認列到業績,就可以把Show-rooming的現象,變成推動OMO的助力。
同源政策是瀏覽器基於安全性考量而存在的一個政策,針對瀏覽器指令碼的限制。
Thumbnail
患有罕見癲癇疾病卓飛症候群 (Dravet Syndrome,DS) 的小女孩夏洛特 (Charlotte Figi) 終於不敵病魔,在家人和親友的陪同下,星期二早上在醫院與世長辭,令人惋惜的是,只有13歲的她不幸逝世的原因並不是奮鬥多年的卓飛症候群,而是今年席捲全球的肺炎疫情。
Thumbnail
本專欄將提供給您最新的市場資訊、產業研究、交易心法、精選公司介紹,以上內容並非個股分析,還請各位依據自身狀況作出交易決策。歡迎訂閱支持我,獲得相關內容,也祝您的投資之路順遂! 每年 $990 訂閱方案👉 https://reurl.cc/VNYVxZ 每月 $99 訂閱方案👉https://re
最近有一些新的覺察,邁入大學的生涯後,更加的明白,有很多的事情需要自己去體會、感受。才能找出屬於自己的最佳解。 大學就是一個小型的社會,多少時間是社交,又多少時間是留給自己,是一個流動的狀態,卻是大部分會給我帶來情緒波動的主因。 最近感悟到,當我在面對與自己完全不同的人時學到了如果對方沒有主動問
在棋盤的每一角落,棄子不僅是一種策略,更是一門藝術。
Thumbnail
不純粹的閱讀,你必然得到純粹的結論,例如看到討厭的同學發臉文,心裡開始品頭論足,最後得出他失戀失業的無能結論。嗯,或許討厭的同學只是單純實驗做失敗而已。 這年代了解不純粹的純粹很重要,還記得2024總統大選,有許多工程師小草放大自己的專業能力,覺得別人都很笨,用極大的意義解讀其他政治人物的動機?
Thumbnail
畢業季,離情依依,怕感情變疏遠!送別禮物特別能延續感情,但要送什麼好呢?讓友情歷久彌堅,分享好朋友送禮攻略!好書推薦「長輩沒教,但你一定要懂的81種送禮大學問」!
Thumbnail
之前研究Google簡報的時候,發現Google簡報並沒有提供畫筆工具、開啟YouTube影片時也沒辦法在影片上直接畫圖寫字。所以這次找了一個Chrome的外掛程式 Web Paint。功能非常簡單,趕快跟著圖卡操作看看吧!
我保證我會專門寫一些專門針對分子 ARweb 的帖子,描述我們是如何製作它的,以及教師如何在課堂上使用它!目前,教師可以查看這篇論文或預印本。 AR 在科學教育中的應用不僅限於查看分子。Google 提供 WebXR 體驗來觀察各種化學和生物學學科(植物、細胞、動物等)的帶註釋(在某些情況下是動畫)
Thumbnail
門市通路很不喜歡Show-rooming(展聽現象),透過重建OMO顧客旅程,可以讓Show-rooming的消費者的線上消費,可以歸因回某門市的服務,並讓門市認列到業績,就可以把Show-rooming的現象,變成推動OMO的助力。
同源政策是瀏覽器基於安全性考量而存在的一個政策,針對瀏覽器指令碼的限制。
Thumbnail
患有罕見癲癇疾病卓飛症候群 (Dravet Syndrome,DS) 的小女孩夏洛特 (Charlotte Figi) 終於不敵病魔,在家人和親友的陪同下,星期二早上在醫院與世長辭,令人惋惜的是,只有13歲的她不幸逝世的原因並不是奮鬥多年的卓飛症候群,而是今年席捲全球的肺炎疫情。