ajax跨域問題簡單解決 1

2022-05-16 14:36:10 字數 1741 閱讀 4725

js不能跨域請求資料,js可以跨域載入js檔案,比如使用jquery可以引用官網的url,這也是跨域

解決js的跨域問題可以使用jsonp。

先來說一下什麼是跨域和非跨域

簡單的據一些例子

(非跨域)

呼叫

(主網域名稱不同:123/456,跨域)

呼叫

(子網域名稱不同:abc/def,跨域)

呼叫

(埠不同:8080/8081,跨域)

呼叫

(協議不同:http/https,跨域)

呼叫

請注意:localhost和

127.0.0.1

雖然都指向本機,但也屬於跨域。

跨域的問題:

瀏覽器存在限制,不讓訪問資料。而不是服務端的限制,服務端正常傳送請求,也正常響應了,但是當資料到達瀏覽器,瀏覽器不讓js去拿這些資料。此時以上

ajax

的方案就起不到作用。

解決方案一:jsonp

原理:利用

script

標籤,載入

src路徑,實現跨域載入

js檔案。該

js檔案中需要定義好乙個方法,將該方法名傳遞給服務端,服務端根據該方法名,拼裝乙個方法呼叫語句,響應給瀏覽器。又瀏覽器來執行該語句呼叫方法。通過引數,將響應的資料取出即可

實現:js:

1.定義乙個方法,

script

載入2.取方法中引數,進行業務處理。

jq:已經封裝好了

只需要在jq的

ajax

中,指定

datatype

為"jsonp",jq

在傳送請求前會先定義好乙個方法。

傳送請求時會將該方法作為引數(

callback

)傳遞給服務端。

服務端響應,呼叫方法,把資料取出,傳遞給

data

,data

中拿到的即為服務端資料。

服務端的配合:

改造方法:

controller示例

//響應型別contenttype可以指定produces="",

/user/token/

@responsebody

public string getuserbytoken(@pathvariable string token,string callback)

return

jsonutils.objecttojson(result);

}

ajxa示例

1

$.ajax(

1415 });

當ajax非同步請求增加datatpe:「jsonp」引數後,

1.發出去的請求型別在瀏覽器可以看到是script型別的,瀏覽器是不會校驗的。普通的ajax請求是xhr型別的。

2.返回的型別不同:普通的ajax請求content-type是json,而jsonp的請求content-type是js指令碼。

解決AJAX跨域問題

解決ajax跨域問題 跨域不一定會有跨域問題。因為跨域問題是瀏覽器對於ajax請求的一種安全限制 乙個頁面發起的ajax請求,只能是於當前頁同網域名稱的路徑,這能有效的阻止跨站攻擊。因此 跨域問題 是針對ajax的一種限制。雖然原理比較複雜 import org.springframework.co...

跨域問題詳解 ajax跨域解決

跨域問題的產出,根本原因在於瀏覽器的同源策略,什麼又是同源策略呢,官方解釋 同源策略限制了從同乙個源載入的文件或指令碼如何與來自另乙個源的資源進行互動。這是乙個用於隔離潛在惡意檔案的重要安全機制。同源的定義 如果兩個頁面的協議,埠 如果有指定 和網域名稱都相同,則兩個頁面具有相同的源。可以跨域讀取其...

jsonp解決ajax跨域問題

利用jsonp解決ajax跨域問題 至於success裡面的操作可以忽略 某工程下ajax請求 var isvisible true function getlog var startpage data.startpage var endpage data.endpage 拼接 導航 按鈕 和 資料...