php利用jsonp實(shí)現(xiàn)跨域
JSONP(JSON with Padding)是一種使用普通的<script>
標(biāo)簽來發(fā)起跨域請(qǐng)求的方法。JSONP利用了HTML頁面可以直接引入外部JavaScript文件而不受同源策略限制的特性
實(shí)現(xiàn)效果
1、實(shí)現(xiàn)代碼中php文件
<?php // 接收GET請(qǐng)求參數(shù) $param = $_GET['callback']; // 生成需要返回的數(shù)據(jù) $data = array( 'name' => '張三', 'age' => 23 ); // 將數(shù)據(jù)轉(zhuǎn)換為JSON字符串 $jsonStr = json_encode($data); // 安全過濾回調(diào)函數(shù)名 $callback = preg_replace('/[^a-zA-Z0-9_]/', '', $param); // 返回帶有回調(diào)函數(shù)名和JSON數(shù)據(jù)的響應(yīng) echo $callback . '(' . $jsonStr . ')';
2、js代碼
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JSONP跨域請(qǐng)求示例</title> </head> <body> <script> function handleResponse(data) { // 在這里處理返回的數(shù)據(jù) console.log(data); } var script = document.createElement('script'); script.src = 'http://localhost/test5.php?callback=handleResponse'; if (document.body) { document.body.appendChild(script); } else { document.addEventListener('DOMContentLoaded', function() { document.body.appendChild(script); }); } </script> </body> </html>
JSONP的原理如下:
在客戶端,當(dāng)需要從不同域的服務(wù)器獲取數(shù)據(jù)時(shí),創(chuàng)建一個(gè)<script>元素,并將其src屬性設(shè)置為要請(qǐng)求的URL,并將回調(diào)函數(shù)的名稱作為URL參數(shù)傳遞。
在服務(wù)器端,接收到帶有回調(diào)函數(shù)名稱的請(qǐng)求后,服務(wù)器會(huì)將數(shù)據(jù)使用回調(diào)函數(shù)包裹起來作為響應(yīng)返回給客戶端。
在客戶端,瀏覽器解析返回的JavaScript代碼,并執(zhí)行其中的回調(diào)函數(shù),將數(shù)據(jù)傳遞給回調(diào)函數(shù)進(jìn)行處理。 具體流程如下:
客戶端通過動(dòng)態(tài)創(chuàng)建<script>元素,設(shè)置其src屬性為跨域請(qǐng)求的URL,并在URL中傳遞一個(gè)回調(diào)函數(shù)的名稱作為參數(shù),例如:http://example.com/data?callback=handleResponse。
服務(wù)器接收到這個(gè)請(qǐng)求后,根據(jù)參數(shù)中的回調(diào)函數(shù)名稱,將要返回的數(shù)據(jù)使用回調(diào)函數(shù)進(jìn)行包裹,例如:handleResponse({"name": "張三", "age": 23})。
服務(wù)器將包含回調(diào)函數(shù)和數(shù)據(jù)的響應(yīng)返回給客戶端,響應(yīng)內(nèi)容會(huì)被當(dāng)作JavaScript代碼解析。
客戶端瀏覽器解析響應(yīng)內(nèi)容,并執(zhí)行其中的回調(diào)函數(shù),將數(shù)據(jù)傳遞給回調(diào)函數(shù)進(jìn)行處理。這樣,跨域請(qǐng)求的數(shù)據(jù)就被成功獲取到了。 JSONP的關(guān)鍵在于使用了普通的<script>標(biāo)簽去請(qǐng)求跨域資源,并且服務(wù)器返回的是可執(zhí)行的JavaScript代碼,這樣瀏覽器就能夠成功加載并執(zhí)行返回的代碼。由于JavaScript沒有同源策略限制,因此可以跨域訪問數(shù)據(jù)。但需要注意的是,JSONP只支持GET請(qǐng)求,不支持POST等其他類型的請(qǐng)求。另外,為了避免安全風(fēng)險(xiǎn),應(yīng)當(dāng)對(duì)回調(diào)函數(shù)的名稱進(jìn)行嚴(yán)格的過濾,確保只允許合法的回調(diào)函數(shù)名稱被執(zhí)行。
到此這篇關(guān)于php利用jsonp實(shí)現(xiàn)跨域的文章就介紹到這了,更多相關(guān)php jsonp跨域內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
PHP+MySQL存儲(chǔ)數(shù)據(jù)常見中文亂碼問題小結(jié)
這篇文章主要介紹了PHP+MySQL存儲(chǔ)數(shù)據(jù)常見中文亂碼問題,針對(duì)php+mysql常見的中文亂碼問題予以總結(jié)分析,并給出了解決方法供大家參考,需要的朋友可以參考下2016-06-06php處理json格式數(shù)據(jù)經(jīng)典案例總結(jié)
這篇文章主要介紹了php處理json格式數(shù)據(jù)的方法,詳細(xì)講述了json格式數(shù)據(jù)的概念與用法,并結(jié)合經(jīng)典案例總結(jié)分析了php操作json格式數(shù)據(jù)的常用技巧,需要的朋友可以參考下2016-05-05php不用GD庫生成當(dāng)前時(shí)間的PNG格式圖象的程序
該程序是不用GD庫可以生成當(dāng)前時(shí)間的PNG格式圖象,給人大開眼界,很有參考價(jià)值. teaman整理2008-09-09使用純php代碼實(shí)現(xiàn)頁面?zhèn)戊o態(tài)的方法
這篇文章主要介紹了使用純php代碼實(shí)現(xiàn)頁面?zhèn)戊o態(tài)的方法,涉及php服務(wù)器預(yù)定義變量及正則匹配的相關(guān)使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07PHP調(diào)用QQ互聯(lián)接口實(shí)現(xiàn)QQ登錄網(wǎng)站功能示例
這篇文章主要介紹了PHP調(diào)用QQ互聯(lián)接口實(shí)現(xiàn)QQ登錄網(wǎng)站功能,結(jié)合實(shí)例形式分析php調(diào)用QQ互聯(lián)接口實(shí)現(xiàn)QQ登錄網(wǎng)站的相關(guān)操作技巧,需要的朋友可以參考下2019-10-10PHP使用PHPExcel讀取excel數(shù)據(jù)并批量上傳到數(shù)據(jù)庫
這篇文章主要為大家詳細(xì)介紹了PHP如何使用PHPExcel讀取excel數(shù)據(jù)并批量上傳到數(shù)據(jù)庫,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以參考一下2024-12-12