jsonp和cors方式

最新推荐文章于 2023-08-16 21:02:20 发布

caiqiiqi

最新推荐文章于 2023-08-16 21:02:20 发布

阅读量689

点赞数

CC 4.0 BY-SA版权

分类专栏：安全

本文链接：https://blog.csdn.net/caiqiiqi/article/details/81750384

安全专栏收录该内容

258 篇文章

订阅专栏

浏览器是拒绝跨域请求的，通常解决跨域会采用JSONP(JSON with Padding)和CORS(Cross-Origin Resource Sharing).

环境

8082

目录/var/www/exercise2
192.168.170.199:8082下index.html

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">
</script>
<!--
<script type="text/javascript" src="http://192.168.170.199:8081/exercise/jsonp.php?callback=jsonpCallback"></script>
-->
<script type="text/javascript">
function jsonpCallback(data) {
    console.log(data);
}
function remote() {
    $.ajax({
        url: "http://192.168.170.199:8081/exercise/jsonp.php",
        dataType: "jsonp",
        jsonpCallback: "jsonpCallback",
        success: function(data) {
            console.log("[*] Success: " + data);
        }
    });
}

jQuery(document).ready(function(){
    remote();
});
</script>
</head>
</body>
</html>

启动

php -S 0.0.0.0:8082

这里写图片描述

8081

目录/var/www/exercise
192.168.170.199:8081下jsonp.php

<?php
    header('content-type: application/json; charset=utf-8');
    $data = array('first'=>'Qiqi', 'last'=> 'Cai');
    echo $_GET['callback'].'('.json_encode($data).')';
?>