Jsonp 原理簡述

2022-09-08 17:42:12 字數 483 閱讀 7710

瀏覽器因為安全問題而有乙個同源策略,不允許跨域請求資料。但是 js 指令碼資源和資源還是被允許跨域請求的。在 web 開發中,遇到要跨域請求 json 資料時,可以用 jsonp 的方式來繞過瀏覽器的同源策略。

現在,已經有很多任務具將 jsonp 封裝,如 jquery ,vue 等等。

那麼封裝起來的 ajxa 做了什麼呢,個人認為主要有以下:

0、建立乙個**函式。有以下**類似功能。

function

callback (str)

1、動態建立乙個 script 標籤,其中 src 中 query 部分告訴伺服器自己要請求的資料以及**函式的名字。

2、指令碼返回後立即執行**函式,該函式所攜帶的引數就是我們請求的資料。

//

後台返回的內容

callback();

3、刪除建立的 script 標籤。

4、刪除建立的**函式。

jsonp原理詳解

jsonp json with padding 是 json 的一種 使用模式 可以讓網頁從別的網域名稱 那獲取資料,即跨域讀取資料。為什麼我們從不同的域 訪問資料需要乙個特殊的技術 jsonp 呢?這是因為同源策略。所謂同源是指,網域名稱,協議,埠相同。所謂 同源策略 簡單的說就是基於安全考慮,當...

JSONP原理小記

大家都知道jsonp json with padding引數式json 是跨域傳輸資料的方法,jq等很多類庫都封裝了jsonp的方法,但是他的原理是怎樣的呢?下面舉個我認為最淺顯的栗子,大家看過了都會明白原理!jsonp的原理,概括點說,就是動態插入元素,當然元素引用的js檔案是伺服器傳過來的,他與...

ajax工作原理,Jsonp原理

ajax工作原理是 相當於在使用者和伺服器之間加了 個中間層 ajax引擎 使使用者操作與伺服器響應非同步化。對於使用者請求ajax引擎會做一些資料驗證和資料處理,不是所有請求都提交給伺服器,當需要從伺服器讀取新資料時由ajax引擎代為向伺服器提交請求。ajax最大優點就是不重新整理整個頁面的前提下...