PHP AJAX JSONP实现跨域请求使用实例

最新推荐文章于 2022-07-22 10:53:04 发布

PHP_Undifind

最新推荐文章于 2022-07-22 10:53:04 发布

阅读量179

点赞数

分类专栏： PHP ajax跨域

PHP 同时被 2 个专栏收录

35 篇文章 0 订阅

订阅专栏

ajax跨域

2 篇文章 0 订阅

订阅专栏

今天我写的是PHP AJAX JSONP使用的实例。不清楚jsonp是什么的请自己搜索

实例1

test.html

[html]view plaincopy
<!doctype html>  
<html>  
<head>  
<meta charset="utf-8">  
<title>test</title>  
<script src="jquery-1.5.2.min.js"></script>  
<script src="ajax.js"></script>  
</head>  
   
<body>  
</body>  
</html>  

ajax.js

[javascript]view plaincopy
$.ajax({  
    type : "post",  
    url : "ajax.php",  
    dataType : "jsonp",  
    jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)  
    jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名  
    success : function(json){  
        alert('success');  
    },  
    error:function(){  
        alert('fail');  
    }  
});  

ajax.php

[php]view plaincopy
<?php  
   
$data = ".......";  
$callback = $_GET['callback'];  
echo $callback.'('.json_encode($data).')';  
exit;  
   
?>  

jquery-1.5.2.min.js

自己上网下载

当使用jsonp时，使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。

实例2

test.html

[html]view plaincopy
<!doctype html>  
<html>  
<head>  
<meta charset="utf-8">  
<title>test</title>  
<script src="jquery-1.5.2.min.js"></script>  
<script src="ajax.js"></script>  
</head>  
   
<body>  
<form name="form">  
<input type="text" name="sex">  
<input type="text" name="age">  
<input type="button" id="btn" value="button" />  
</form>  
</body>  
</html>  

ajax.js

[javascript]view plaincopy
$(document).ready(function(){  
   
    $("#btn").click(function(k) {  
        //...  
        var j = $("form").serializeArray();//序列化name/value  
        $.ajax({  
            type: 'GET',  //这里用GET  
            url: 'ajax.php',  
            dataType: 'jsonp',  //类型  
            data: j,  
            jsonp: 'callback', //jsonp回调参数，必需  
            async: false,  
            success: function(result) {//返回的json数据  
                alert(result.message); //回调输出  
                   
                result = result || {};  
                if (result.msg=='err'){  
                    alert(result.info);  
                }else if (result.msg=="ok"){  
                    alert('提交成功');  
                }else{  
                    alert('提交失败');  
                }  
                   
            },  
            timeout: 3000  
        })  
        //...  
    });  
       
});  

ajax.php

[php]view plaincopy
<?php  
$callback = isset($_GET['callback']) ? trim($_GET['callback']) : ''; //jsonp回调参数，必需  
$date = array("age"=>$_GET['age'], "message"=>$_GET['age']);  
$date["msg"]="err";  
$date["info"]="因人品问题，发送失败";  
$tmp= json_encode($date); //json 数据  
echo $callback . '(' . $tmp .')';  //返回格式，必需  
?>  

jquery-1.5.2.min.js

自己网上下载

在之前我写过“php返回json数据简单实例”，“php返回json数据中文显示的问题”和“在PHP语言中使用JSON和将json还原成数组”。有兴趣的童鞋可以看看

今天我写的是PHP AJAX JSONP使用的实例。不清楚jsonp是什么的请自己搜索

实例1

test.html

[html]view plaincopy
<!doctype html>  
<html>  
<head>  
<meta charset="utf-8">  
<title>test</title>  
<script src="jquery-1.5.2.min.js"></script>  
<script src="ajax.js"></script>  
</head>  
   
<body>  
</body>  
</html>  

ajax.js

[javascript]view plaincopy
$.ajax({  
    type : "post",  
    url : "ajax.php",  
    dataType : "jsonp",  
    jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)  
    jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名  
    success : function(json){  
        alert('success');  
    },  
    error:function(){  
        alert('fail');  
    }  
});  

ajax.php

[php]view plaincopy
<?php  
   
$data = ".......";  
$callback = $_GET['callback'];  
echo $callback.'('.json_encode($data).')';  
exit;  
   
?>  

jquery-1.5.2.min.js

自己上网下载

当使用jsonp时，使用 JSONP 形式调用函数时，如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。

实例2

test.html

[html]view plaincopy
<!doctype html>  
<html>  
<head>  
<meta charset="utf-8">  
<title>test</title>  
<script src="jquery-1.5.2.min.js"></script>  
<script src="ajax.js"></script>  
</head>  
   
<body>  
<form name="form">  
<input type="text" name="sex">  
<input type="text" name="age">  
<input type="button" id="btn" value="button" />  
</form>  
</body>  
</html>  

ajax.js

[javascript]view plaincopy
$(document).ready(function(){  
   
    $("#btn").click(function(k) {  
        //...  
        var j = $("form").serializeArray();//序列化name/value  
        $.ajax({  
            type: 'GET',  //这里用GET  
            url: 'ajax.php',  
            dataType: 'jsonp',  //类型  
            data: j,  
            jsonp: 'callback', //jsonp回调参数，必需  
            async: false,  
            success: function(result) {//返回的json数据  
                alert(result.message); //回调输出  
                   
                result = result || {};  
                if (result.msg=='err'){  
                    alert(result.info);  
                }else if (result.msg=="ok"){  
                    alert('提交成功');  
                }else{  
                    alert('提交失败');  
                }  
                   
            },  
            timeout: 3000  
        })  
        //...  
    });  
       
});  

ajax.php

[php]view plaincopy
<?php  
$callback = isset($_GET['callback']) ? trim($_GET['callback']) : ''; //jsonp回调参数，必需  
$date = array("age"=>$_GET['age'], "message"=>$_GET['age']);  
$date["msg"]="err";  
$date["info"]="因人品问题，发送失败";  
$tmp= json_encode($date); //json 数据  
echo $callback . '(' . $tmp .')';  //返回格式，必需  
?>  

jquery-1.5.2.min.js

PHP_Undifind

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
PHP AJAX JSONP实现跨域请求使用实例

今天我写的是PHP AJAX JSONP使用的实例。不清楚jsonp是什么的请自己搜索实例1test.html[html] view plain copy&lt;!doctype html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;test&lt;/title&gt; &lt
复制链接

扫一扫

专栏目录