【AJAX】AJAX的跨域問題-創(chuàng)新互聯(lián)

AJAX的跨域問題
  • 跨域的概述
    • 區(qū)別同源與不同源
    • 同源策略有什么用?
  • AJAX跨域解決方案
    • 方案一、設(shè)置響應(yīng)頭
    • 方案二、jsonp
    • 方案三、代理機(jī)制(httpclient)

創(chuàng)新互聯(lián)專注于金城江企業(yè)網(wǎng)站建設(shè),成都響應(yīng)式網(wǎng)站建設(shè)公司,商城網(wǎng)站建設(shè)。金城江網(wǎng)站建設(shè)公司,為金城江等地區(qū)提供建站服務(wù)。全流程按需制作,專業(yè)設(shè)計(jì),全程項(xiàng)目跟蹤,創(chuàng)新互聯(lián)專業(yè)和態(tài)度為您提供的服務(wù)跨域的概述
  1. 跨域是指從一個域名的網(wǎng)頁去請求另一個域名的資源。比如從百度(https://baidu.com)頁面去請求京東(https://www.jd.com)的資源。
  2. 通過超鏈接、form表單提交、window.location.href、document.location.href、script標(biāo)簽、img標(biāo)簽等方式進(jìn)行跨域是不存在問題的。但在一個域名的網(wǎng)頁中的一段js代碼發(fā)送AJAX請求去訪問另一個域名中的資源,由于同源策略的存在導(dǎo)致無法跨域訪問,AJAX就存在這種跨域問題。
  3. 同源策略是指一段腳本只能讀取來自同一來源的窗口和文檔的屬性,同源就是協(xié)議、域名和端口都相同。

下面是使用AJAX發(fā)送請求跨域訪問資源出現(xiàn)的問題:請求的資源上不存在“訪問控制允許源”標(biāo)頭:(就是被同源策略阻止了)

在這里插入圖片描述

區(qū)別同源與不同源

區(qū)分同源和不同源的三要素:

  1. 協(xié)議
  2. 域名
  3. 端口

協(xié)議一致,域名一致,端口號一致,三要素都要一致,才是同源,其它一律都是不同源。

在這里插入圖片描述

同源策略有什么用?

如果你剛剛在網(wǎng)銀輸入賬號密碼,查看了自己還有一萬 元塊錢,緊接著訪問一些不規(guī)矩的網(wǎng)站,這個網(wǎng)站可以訪問剛剛的網(wǎng)銀站點(diǎn),并且獲取賬號密碼,那后果可想而知。所以,從安全的角度來講,同源策略是有利于保護(hù)網(wǎng)站信息的。

AJAX跨域解決方案

有一些情況下,我們是需要使用AJAX進(jìn)行跨域訪問的。比如某公司的A頁面(a.aresourse.com)有可能需要獲取B頁面(b.bresourse.com)。
在這里插入圖片描述

方案一、設(shè)置響應(yīng)頭
  • 核心原理:跨域訪問的資源允許你跨域訪問。(被調(diào)用方允許你可跨域訪問)
  • 實(shí)現(xiàn):
response.setHeader("Access-Control-Allow-Origin","http://localhost:8080/ajax/ajax7.html");//允許某個
response.setHeader("Access-Control-Allow-Origin","*");//允許所有

在這里插入圖片描述

方案二、jsonp

jsonp:json with padding

  • jsonp不是一個真正的AJAX請求。只不過可以完成AJAX的局部刷新效果??梢哉fjsonp是一種類AJAX請求的機(jī)制。

jsonp可以解決跨域問題。
注意:jsonp解決跨域的時(shí)候,只支持GET請求。不支持post請求。這是因?yàn)?code>jsonp本就是動態(tài)的創(chuàng)建script標(biāo)簽從而達(dá)到跨域的效果。

下面是動態(tài)創(chuàng)建的代碼:
在這里插入圖片描述

效果展示:

在這里插入圖片描述

jQuery封裝了jsonp,也就是說可以使用jQuery庫去進(jìn)行編寫jsonp代碼,方便。

核心代碼如下:

$.ajax({type:"GET",
	url:"跨域的url",
	dataType:"jsonp",   //指定數(shù)據(jù)類型
	jsonp:"fun",    //指定參數(shù)名(不設(shè)置的時(shí)候,默認(rèn)是”callback“)
	jsonpCallback:"sayHello"   //指定回調(diào)函數(shù)的名字,不設(shè)置的時(shí)候,jQuery會自動生成一個隨機(jī)的回調(diào)函數(shù),
	//并且這個回調(diào)函數(shù)還會自動調(diào)用success的回調(diào)函數(shù)
})
方案三、代理機(jī)制(httpclient)

“調(diào)用方”解決跨域的問題是這個思路的:讓發(fā)送出去的請求代理成是本域的。
如果資源是本域的,那就側(cè)面地進(jìn)行了跨域。

  • 使用Java程序怎么去發(fā)送get/post請求呢?【GET和POST請求就是HTTP請求】
  1. 使用JDK內(nèi)置的APIjava.net.URL....),這些API是可以發(fā)送HTTP請求的。
  2. 使用第三方的開源組件,比如:apachehttpclient組件。(httpclient組件是開源免費(fèi)的,可以直接用)。

你是否還在尋找穩(wěn)定的海外服務(wù)器提供商?創(chuàng)新互聯(lián)www.cdcxhl.cn海外機(jī)房具備T級流量清洗系統(tǒng)配攻擊溯源,準(zhǔn)確流量調(diào)度確保服務(wù)器高可用性,企業(yè)級服務(wù)器適合批量采購,新人活動首月15元起,快前往官網(wǎng)查看詳情吧

新聞名稱:【AJAX】AJAX的跨域問題-創(chuàng)新互聯(lián)
文章出自:http://muchs.cn/article22/dhsgjc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供服務(wù)器托管關(guān)鍵詞優(yōu)化、品牌網(wǎng)站制作、網(wǎng)站改版、企業(yè)網(wǎng)站制作、外貿(mào)建站

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

成都app開發(fā)公司