jsonp總結

時間 2019-11-10

標籤 jsonp 總結欄目 JSON 简体版

原文原文鏈接

因爲「同源策略」的限制，ajax不能作跨域請求，jsonp是當下解決跨域請求最流行的方案，來個例子(index.html)：javascript

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Document</title>
    <script src="js/jquery.js"></script>
</head>
<body>
<input type="button" value="submit" id="submit">
<div id="txt"></div>
<script>
//監聽對象
// document.getElementById('submit').onclick = function(){
  
// }
//簡單的jsonpCallback封裝
function jsonpCallback(data){//回調函數
  console.log(data);
}
var jsonp = document.createElement("script");//動態添加腳本
jsonp.type = "text/javascript";
jsonp.src="json.php?callback=jsonpCallback";
document.getElementsByTagName("head")[0].appendChild(jsonp);
</script>
</body>
</html>

json.php頁面：php

<?php
$info = array("name"=>"復讀機2","age"=>223);
$infoencode = json_encode($info);
$callback = $_GET["callback"];
echo $callback."(".$infoencode.")";//返回帶有json格式數據的字符串
?>