隨著行動互聯網的快速發展,越來越多的網站開始使用Web API提供資料服務。當我們在前端使用Web API取得資料時,一般情況下會使用AJAX來進行非同步請求。但是,由於瀏覽器的同源策略限制,AJAX只能請求同源伺服器的數據,這就限制了前端取得資料的範圍。
為了解決跨域問題,jsonP技術應運而生。下面我們來詳細了解jsonP在前端資料取得的應用。
一、JSONP原理
JSONP(JSON with padding)是一種跨域資料傳輸方式,它是透過動態添加script標籤來進行跨域資料請求並取得JSON資料的。 JSONP在前端使用上的原理如下:
首先,前端向服務端發起一個JSONP請求,請求位址為跨域位址。 JSONP請求的URL中需要包含一個callback參數,後端根據該參數產生回應的JSON數據,並以函數呼叫的形式傳回給前端,前端再將回應的資料解析處理。
具體的流程如下圖所示:
二、服務端回應JSONP請求
目前端發起JSONP請求,服務端需要正確的回應請求。對於JSONP請求,服務端需要傳回一個指定名稱的JavaScript函數,並在函數呼叫時呼叫服務端產生的JSON資料。以下是一個JSONP回應的實例:
總結一下,服務端需要實作以下幾點:
三、前端處理JSONP回應
當服務端正確回應JSONP請求後,前端需要正確處理回應資料。前端需要做的事情如下:
下面是一個JSONP處理的實例:
最後,我們需要注意的一點是,在進行JSONP請求時,由於回應的資料會以JavaScript的形式傳回,如果在傳回的資料包含了JavaScript語句,則需要進行轉義處理,否則會影響前端程式碼的執行。常見的轉義函數有jQuery的$.parseJSON()函數和JavaScript的JSON.parse()函數。
To be continued...
以上是php jsonp 轉化json數據的詳細內容。更多資訊請關注PHP中文網其他相關文章!