大家好，我是IT修真院北京分院第22期的學(xué)員楊綱散休，一枚正直純潔善良的WEB前端程序員媒楼。
1.背景介紹
所有支持Javascript的瀏覽器都會(huì)使用同源策略這個(gè)安全策略。導(dǎo)致我們無(wú)法直接訪問(wèn)非同源的鏈接戚丸，無(wú)法取得非同源的數(shù)據(jù)划址，但在項(xiàng)目中我們的數(shù)據(jù)經(jīng)常寫(xiě)在另一個(gè)源中，于是我們需要突破同源限制限府，取得其他源的數(shù)據(jù)猴鲫，這就叫跨域。
2.知識(shí)剖析
常見(jiàn)的跨域方法有:
jsonp,利用了src屬性可以跨域的特性
document.domain跨子域
Access Control,服務(wù)器端發(fā)送Access-Control-Allow-Origin響應(yīng)頭谣殊，規(guī)定請(qǐng)求的域名的訪問(wèn)權(quán)限
nginx反向代理，客戶端nginx攔截代碼中虛假的http請(qǐng)求牺弄，替換成正確的http
如何算不同的域姻几？
不同域名
同一域名，不同端口
同一域名，不同協(xié)議
域名和域名對(duì)應(yīng)ip
主域相同蛇捌，子域不同
同一域名抚恒，不同二級(jí)域名
3.常見(jiàn)問(wèn)題
JSONP是如何實(shí)現(xiàn)跨域的
4.解決方案
有兩個(gè)文件處于不同域中：
A.html
B.js
結(jié)果會(huì)alert“success”，這就是jsop的基本原理
5.編碼實(shí)戰(zhàn)
6.擴(kuò)展思考
JSONP跨域有什么優(yōu)缺點(diǎn)络拌？
優(yōu)點(diǎn)：兼容性很好好俭驮，可以在古老的瀏覽器中運(yùn)行，
jsonp和ajax有什么關(guān)系春贸？
ajax是通過(guò)操作XMLHttpRequest對(duì)象發(fā)送請(qǐng)求混萝，獲取返回的數(shù)據(jù)。JSONP的全稱(chēng)為JSON with Padding萍恕，Padding 指的就是包裹在JSON 外層的回調(diào)函數(shù)逸嘀。從剛才的例子中，咱們發(fā)現(xiàn)JSONP并沒(méi)有操作XMLHttpRequest允粤，因此jsonp和ajax沒(méi)有任何關(guān)系崭倘。
缺點(diǎn)：它只支持GET請(qǐng)求而不支持POST等其它類(lèi)型的HTTP請(qǐng)求。
如何用 JQUERY 實(shí)現(xiàn) JSONP
這里使用了ajax這個(gè)方法类垫，但實(shí)際上jsonp和ajax沒(méi)有任何關(guān)系司光，只是因?yàn)閖sonp請(qǐng)求和ajax請(qǐng)求相似，jquery在這里有誤導(dǎo)之嫌悉患。
7.參考文獻(xiàn)
參考一：跨域資源共享 CORS 詳解
參考二：5 分鐘徹底明白 JSONP
參考三：深入淺出JSONP--解決ajax跨域問(wèn)題
8.更多討論
感謝觀看
BY : 肖浩宇|楊剛
問(wèn)：nginx反向代理是什么：
答：通過(guò)配置欺騙瀏覽器繞過(guò)跨域的一種方式残家，
問(wèn)：nginx和jonsp有什么區(qū)別？
答：jonsp是利用同源策略不限制src跨域而實(shí)現(xiàn)的一種跨域訪問(wèn)數(shù)據(jù)购撼。
問(wèn)：還有那些跨域方法跪削？
答：document.domain跨子域
Access Control,服務(wù)器端發(fā)送Access-Control-Allow-Origin響應(yīng)頭，規(guī)定請(qǐng)求的域名的訪問(wèn)權(quán)限
ppt鏈接：https://ptteng.github.io/PPT/PPT/js-06-how to use jsonpyg.html
視頻鏈接：https://pan.baidu.com/s/1bYX4tg 密碼: 9fqb
今天的分享就到這里啦迂求，歡迎大家點(diǎn)贊碾盐、轉(zhuǎn)發(fā)、留言揩局、拍磚~
------------------------------------------------------------------------------------------------------------------------
技能樹(shù).IT修真院
“我們相信人人都可以成為一個(gè)工程師毫玖，現(xiàn)在開(kāi)始，找個(gè)師兄凌盯，帶你入門(mén)付枫，掌控自己學(xué)習(xí)的節(jié)奏，學(xué)習(xí)的路上不再迷贸墼酰”阐滩。
這里是技能樹(shù).IT修真院，成千上萬(wàn)的師兄在這里找到了自己的學(xué)習(xí)路線县忌，學(xué)習(xí)透明化掂榔，成長(zhǎng)可見(jiàn)化继效，師兄1對(duì)1免費(fèi)指導(dǎo)∽盎瘢快來(lái)與我一起學(xué)習(xí)吧?瑞信！
