跨域解決方案

域(domain)是windows網路中獨立執行的單位，域之間相互訪問則需要建立信任關係(即trust relation)。信任關係是連線在域與域之間的橋梁。當乙個域與其他域建立了信任關係後，2個域之間不但可以按需要相互進行管理，還可以跨網分配檔案和印表機等裝置資源，使不同的域之間實現網路資源的共享與管理。

根本原因是瀏覽器同源策略的約定，有netscape公司在2023年引入瀏覽器，它是瀏覽器最核心也是最基本的安全功能，如果缺少同源策略，瀏覽器很容易受到xss，csfr等攻擊。

同源是指"協議+網域名稱+埠"三者相同，即便兩個不同的網域名稱指向同乙個ip位址，也非同源。協議、網域名稱（主域，子域）、埠有任何一項不同都會產生跨域

2.1什麼是xss(cross site scripting)，因為縮寫與層疊樣式表相同，所以命名為xss

xss中文名是跨站指令碼攻擊，xss攻擊通常指的是通過利用網頁開發時留下的漏洞，通過巧妙的方法注入惡意指令**到網頁，使使用者載入並執行攻擊者惡意製造的網頁程式。這些惡意網頁程式通常是j**ascript，但實際上也可以包括j**a、 vbscript、activex、 flash 或者甚至是普通的html。攻擊成功後，攻擊者可能得到包括但不限於更高的許可權（如執行一些操作）、私密網頁內容、會話和cookie等各種內容。

2.2什麼是csfr(cross-site request forgery),跨站請求偽造

一般來說就是以你的名義傳送郵件，發訊息，盜取你的賬號，在受害者不知情的情況下，以受害者名義偽造請求傳送給受攻擊站點，從而在受害者並未授權的情況下執行受害者許可權下的各種操作。

攻擊過程原理：

簡單跨域請求，在服務端設定access-control-allow-origin即可，前端無需設定。

node的實現**：

const express = require('express');
////允許所有的介面跨域訪問，允許任意的 主機 來訪問我。
res.header("access-control-allow-origin", "*");
next();
});

非簡單跨域請求，在正式通訊之前，增加一次http查詢請求稱為預檢，需要在請求頭新增的**

access-control-allow-credentials: 《可選》 true表示允許傳送cookies

access-control-expose-headers: 《可選》呼叫getresponseheader()可以獲取的其它字段

為什麼最實用？支援所有的http請求，不需要前端配置，是最主流的結局方案。存在的問題是ie5、6、7不支援，但是微軟公司表示，從明年6月15日開始，ie瀏覽器將正式退出歷史的舞台

extend：什麼是cookie

cookie 是一些資料, 儲存於你電腦上的文字檔案中。

當 web 伺服器向瀏覽器傳送 web 頁面時，在連線關閉後，服務端不會記錄使用者的資訊。

cookie 的作用就是用於解決 "如何記錄客戶端的使用者資訊":

cookie 以名/值對形式儲存，如下所示:

username = xiaoming

當瀏覽器從伺服器上請求 web 頁面時，屬於該頁面的 cookie 會被新增到該請求中。服務端通過這種方式來獲取使用者的資訊。

瀏覽器不允許跨域請求資源，但允許跨域群請求檔案。jsonp主要是利用script的src標籤鏈結外部js檔案，以函式呼叫的形式，將要傳遞的資料作為函式引數進行傳遞。需要前後端的配合不僅工作效率低，而且只支援get請求

頁面**：伺服器**：
handlecallback()

優點是適用於所有瀏覽器，實現簡單，缺點是只能使用get請求，比較侷限，現在使用頻率比較低。

window.postmessage()是html5的乙個介面，專注實現不同視窗不同頁面的跨域通訊（即是有點也是缺點）。postmessage是html5 xmlhttprequest level 2中的api，且是為數不多可以跨域操作的window屬性之一，它可用於解決以下方面的問題：

用法：postmessage(data,origin)方法接受兩個引數：

頁面1

頁面2
// 接收domain1的資料
window.addeventlistener('message', function(e) 
}, false);

跨域解決方案

跨域解決方案

跨域解決方案

跨域解決方案

相關推薦