jsonp跨域請求

2022-04-13 04:22:41 字數 1045 閱讀 8174

ajax是不能跨域的,但是利用jsonp是可以實現跨域的,博主今天記錄一篇jsonp跨域的例項。

通俗的說,就是利用的特殊性去請求伺服器,伺服器返回josnp格式資料,jsonp資料格式:function( json ),換句話說,就是把json資料報裝在乙個函式引數中返回,然後呼叫本地js中的function函式,操作json資料。

不難看出其返回值是由callback(json格式資料)組成的,我來以此做乙個小的案例。

案例:本案例只有乙個檔案,07-jsonp.html**:

頁面中主要有乙個文字框和乙個按鈕,點選按鈕,響應sear函式,然後獲取文字框中的值,拼接url,建立script標籤並新增到dom樹中,然後請求此url,然後此script標籤中的內容就是返回的jsonp格式的值,因為jsonp格式的特殊性,需要呼叫callback函式,然後在**函式中使用json資料。

jsonp跨域請求title>

rel="stylesheet"

href="">

head>

//搜尋函式

function

sear

() //**函式

function

callback

(res)

document.getelementbyid('res').innerhtml = str;//把顯示出來

}script>

關鍵字:type="text"

name="keywords"/>

p>

type="button"

value="提交"

onclick="sear();" />

p>

id="res">

div>

body>

html>

JSONP跨域請求

看到jsonp我們會很自然的想到json,但它們卻有很大的不同,json是一種輕量級的資料交換格式,而jsonp可以說是一種非官方的資料互動協議。jsonp json with padding 利用jsonp可以從別的網域名稱下獲取資料,即跨域獲取資料。由於同源策略不允許xmlhttprequest...

JSONP跨域請求

前端常用ajax請求來實現不重新整理頁面方式向伺服器請求資料,但它受瀏覽器同源策略的影響而無法實現跨域請求。然而script標籤src屬性的引用卻是不受跨越限制的,基於此可以傳送跨域請求,服務端不再是返回json格式的資料,而是返回一段呼叫某個函式的js 在src中進行了呼叫。您所在的城市天氣情況 ...

JS跨域請求 Ajax跨域請求JSONP

前兩天被問到ajax跨域如何解決,還真被問住了,光知道有個什麼jsonp,迷迷糊糊的沒有說上來。抱著有問題必須解決的態度,我看了許多資料,原來如此。為何一直知道jsonp,但一直迷迷糊糊的不明白呢?網上那些介紹資料都寫的太複雜了!我是能多簡單就多簡單,爭取讓你十分鐘看完!ajax之所以需要 跨域 罪...