資源描述：
《javascript跨域調(diào)用基于json的restfulapi_javascript技巧》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在工程資料-天天文庫。
1、JavaScript跨域調(diào)用基于JSON的RESTfulAPI1.基本術(shù)語AJAX（AsynchronousJavaScriptAndXML,異步JavaScript和XML）:AJAX是一種用于創(chuàng)建快速動(dòng)態(tài)網(wǎng)頁的技術(shù)，通過在后臺(tái)與服務(wù)器進(jìn)行少量數(shù)據(jù)交換，AJAX可以使網(wǎng)頁實(shí)現(xiàn)異步更新。這意味著可以在不重新加載整個(gè)網(wǎng)頁的情況下,對(duì)網(wǎng)頁的某部分進(jìn)行更新。JSON（JavaScriptObjectNotation）:JSON是一種輕量級(jí)的數(shù)據(jù)交換格式,可以看成是由大括號(hào)包裹起來的多個(gè)^cy/valuc"對(duì)，格式如2｛〃firstName":"Bre
2、tt","lastName":，zMcLaughlin",，zemail/z:，zabcdefg@gmai1.conT｝。CrossDomain（跨域）:跨域問題是［tlTJavaScript語言安全限制中的同源策略造成的，當(dāng)在頁面上使用AJAX請(qǐng)求訪問其他服務(wù)器的數(shù)據(jù)時(shí)，客戶端就會(huì)岀現(xiàn)跨域問題。SameOriginPolicy（同源策略）：同源策略是指一段腳本只能讀取來自同一來源的窗口和文檔的屬性，域名、協(xié)議、端口均相同，即是同源。2.JavaScript跨域解決方案目前主要有三種JavaScript跨域解決方案:基于iframe實(shí)現(xiàn)跨域：兩
3、個(gè)頁面必須展于一個(gè)基礎(chǔ)域（例如都是xxx.com,或是xxx.com.cn）,使用同一協(xié)議（例如都是HTTP）和同一端口（例如都是80）。iframe方案對(duì)域名、協(xié)議、端口的限制太多，用處不大。基于Script標(biāo)簽實(shí)現(xiàn)跨域（JSONP方案）：JSONP（JSONwithPadding）是JSON的一種“使用模式”，是一種非官方的跨域數(shù)據(jù)交互協(xié)議，可用于解決主流瀏覽器的跨域數(shù)據(jù)訪問的問題。JSONP方案的局限性在于：JSONP只能實(shí)現(xiàn)GET請(qǐng)求。基于后臺(tái)代理實(shí)現(xiàn)跨域（CORS方案）:CORS（Cross-OriginResourceSharing
4、,跨域資源共享）是一個(gè)W3C標(biāo)準(zhǔn)，它允許瀏覽器向跨源服務(wù)器發(fā)出XMLHttpRequest請(qǐng)求，從而克服了AJAX只能同源使用的限制。3.基于后臺(tái)代理實(shí)現(xiàn)跨域（CORS方案）具體解決方案如下:①服務(wù)器端服務(wù)器端需要在正常的HTTP回應(yīng)屮增加Access-Control-Allow-Origin、Access-Control-Allow-Methods、Access-Control-Allow-Headers等字段。我的服務(wù)器端是用Python寫的，HTTP請(qǐng)求調(diào)用的webob.Request。修改辦法是，在"res=req.get_respon
5、se(seif.app)n這行代碼之后，需要增加如下幾行內(nèi)容：res.headerlist?append(('Access-Control-Allow-Origin','*'))res.headerlist?append(CAccess-Control-Allow-Methods','GET,POST，))res.headerlist,append(('Access-Control-Max~Age，,'3600'))res.headerlist.append(('Access-Control-Al1ow-Headers5,'Acccss-Con
6、trol-Allow-Origin,Acccss-Control-Allow-Mcthods,Access-Control-Max-Age,X-Auth-Token,Content-Type,Accept'))其中，Access-Control-Allow-Origin最好限制為前端的訪問地址，這樣才和對(duì)安全，例如：res?hcadcrlist?appcnd(('Access一Control一Allow—Origin','http://10.111.121.26:8080,))另外，Access-Control-Max-Age可以設(shè)置CORS相
7、關(guān)配置的緩存時(shí)間，這樣客戶端就不必每次都先進(jìn)行一次預(yù)檢請(qǐng)求(PreflightRequest)。預(yù)檢請(qǐng)求會(huì)先向服務(wù)器端發(fā)出一個(gè)OPTIONS方法、包含“Origin”頭的請(qǐng)求。只有該請(qǐng)求獲得允許以后，才會(huì)發(fā)起真實(shí)的跨域請(qǐng)求。所以，服務(wù)器端在對(duì)X-Auth-Token進(jìn)行鑒權(quán)時(shí)述需要放過預(yù)檢請(qǐng)求，例如：defprocessrequest(self,req):if(req.headers,get(*X-Auth-Token，)!二'open-sesame')and(req.method!='OPTIONS'):returnexc?HTTPForbi
8、dden()②客戶端HTTP請(qǐng)求需要注意到幾個(gè)地方：data需要保證是JSON格式的字符串；contcntType規(guī)定了編碼格式是UTF8；dataT
