JSONP 跨域请求原理

时间:2022-07-02 09:01:36

0x00 简介

由于浏览器的同源策略,我们想要从别的域获取数据变得困难,需要特殊的技术才能获取

 

0x01 使用

客户域:client.com

服务器(他域):server.com

如客户想访问 : http://server.com/try/ajax/jsonp.php?jsonp=callbackFunction。

假设客户期望返回JSON数据:["customername1","customername2"]。

真正返回到客户端的数据显示为: callbackFunction(["customername1","customername2"])。

服务端文件jsonp.php代码为:

<?php
header('Content-type: application/json');
//获取回调函数名
$jsoncallback = htmlspecialchars($_REQUEST ['jsoncallback']);
//json数据
$json_data = '["customername1","customername2"]';
//输出jsonp格式的数据
echo $jsoncallback . "(" . $json_data . ")";
?>

 

客户端的回调函数代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JSONP 实例</title>
</head>
<body>
    <div id="divCustomers"></div>
    <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.getElementById('divCustomers').innerHTML = html;
        }
</script>
<script type="text/javascript" src="http://www.runoob.com/try/ajax/jsonp.php?jsoncallback=callbackFunction"></script>
</body>
</html>

 

0x02 安全问题

jsonp注入解析

新浪微博之点击我的链接就登录你的微博(JSONP劫持)

 

 

 

参考资料:

JSONP教程