使用jsonp解决跨域问题

最新推荐文章于 2024-08-22 11:40:28 发布

百度一下吧

最新推荐文章于 2024-08-22 11:40:28 发布

阅读量189

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/qq_45393395/article/details/125478620

版权

JSONP 跨域回调函数数据请求浏览器同源策略

关键词由CSDN通过智能技术生成

前端专栏收录该内容

37 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JSONP 实例</title>
</head>
<body>
<script type="text/javascript">
function callbackFunction(result, methodName)
{
    var html = '<ul>';
    for(var i = 0; i < result.length; i++)
    {
        html += '<li>' + result[i] + '</li>';
    }
    html += '</ul>';
    document.body.innerHTML += html;
}
</script>
<script type="text/javascript" src="http://localhost:80/jsonp.php?callBack=callbackFunction&a=1"></script>
<script type="text/javascript" src="http://localhost:80/jsonp.php?callBack=callbackFunction&a=2"></script>
<script type="text/javascript" src="http://localhost:80/jsonp.php?callBack=callbackFunction&a=3"></script>
</body>
</html>

<?php
header('Content-type: application/json');
//获取回调函数名
$callBack = htmlspecialchars($_REQUEST ['callBack']);
//json数据

$arr = '["hello","hi"]';
//输出jsonp格式的数据
echo $callBack . "(" . $arr . ")";
?>