跨域
同源策略(Same origin Policy)
瀏覽器出于安全方面的考慮巍沙,只允許與本域下的接口交互赏参。不同源的客戶端腳本在沒有明確授權(quán)的情況下屁商,不能讀寫對方的資源髓废。
本域指的是?
同協(xié)議:如都是http或者h(yuǎn)ttps
同域名:如都是https://www.panda.tv/pubg?和https://www.panda.tv/hearthstone
同端口:如都是80端口
需要注意的是: 對于當(dāng)前頁面來說頁面存放的 JS 文件的域不重要涮总,重要的是加載該 JS 頁面所在什么域
跨域的幾種方法
JSONP
JSONP是通過 script 標(biāo)簽加載數(shù)據(jù)的方式去獲取數(shù)據(jù)當(dāng)做 JS 代碼來執(zhí)行 提前在頁面上聲明一個(gè)函數(shù)兄猩,函數(shù)名通過接口傳參的方式傳給后臺康愤,后臺解析到函數(shù)名后在原始數(shù)據(jù)上「包裹」這個(gè)函數(shù)名玷犹,發(fā)送給前端混滔。換句話說,JSONP 需要對應(yīng)接口的后端的配合才能實(shí)現(xiàn)歹颓。
CORS
CORS 全稱是跨域資源共享(Cross-Origin Resource Sharing)坯屿,是一種 ajax 跨域請求資源的方式,支持現(xiàn)代瀏覽器晴股,IE支持10以上愿伴。 實(shí)現(xiàn)方式很簡單肺魁,當(dāng)你使用 XMLHttpRequest 發(fā)送請求時(shí)电湘,瀏覽器發(fā)現(xiàn)該請求不符合同源策略,會給該請求加一個(gè)請求頭:Origin鹅经,后臺進(jìn)行一系列處理寂呛,如果確定接受請求則在返回結(jié)果中加入一個(gè)響應(yīng)頭:Access-Control-Allow-Origin; 瀏覽器判斷該相應(yīng)頭中是否包含 Origin 的值,如果有則瀏覽器會處理響應(yīng)瘾晃,我們就可以拿到響應(yīng)數(shù)據(jù)贷痪,如果不包含瀏覽器直接駁回,這時(shí)我們無法拿到響應(yīng)數(shù)據(jù)蹦误。所以 CORS 的表象是讓你覺得它與同源的 ajax 請求沒啥區(qū)別劫拢,代碼完全一樣肉津。