suchen

Heim >Backend-Entwicklung >PHP-Tutorial >AJAX und JSONP implementieren domänenübergreifende Anfragen in PHP

AJAX und JSONP implementieren domänenübergreifende Anfragen in PHP

小云云
小云云Original
2018-03-10 09:33:312669Durchsuche

Zuvor habe ich geschrieben: „Ein einfaches Beispiel dafür, wie PHP JSON-Daten zurückgibt“, „PHP gibt JSON-Daten zurück, chinesisches Anzeigeproblem“ und „JSON in der PHP-Sprache verwenden und JSON in ein Array reduzieren“. Ich hoffe, es hilft allen.

Beispiel 1

test.html

<!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

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

ajax.php

<?php
 
$data = ".......";
$callback = $_GET[&#39;callback&#39;];
echo $callback.&#39;(&#39;.json_encode($data).&#39;)&#39;;
exit;
 
?>

jquery-1.5.2.min.js

Laden Sie es selbst herunter

Bei Verwendung von JSONP und beim Aufrufen von Funktionen im JSONP-Format, z. B. „myurl?callback=?“ jQuery ersetzt ? automatisch durch den richtigen Funktionsnamen, um die Rückruffunktion auszuführen.

Beispiel 2

test.html

<!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

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

ajax.php

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

jquery-1.5.2.min.js

Laden Sie es selbst aus dem Internet herunter

Verwandte Empfehlungen:

JS-Cross-Domain-Request-Service-Instanzanalyse

Ajax-Front-End- und Back-End-Methoden zur domänenübergreifenden Anforderungsverarbeitung

Vue verwendet eine detaillierte Erklärung der domänenübergreifenden Anforderungsdateninstanz von Axios

Das obige ist der detaillierte Inhalt vonAJAX und JSONP implementieren domänenübergreifende Anfragen in PHP. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：CURL in PHP erhält Anforderungsheader und AntwortheaderNächster Artikel：CURL in PHP erhält Anforderungsheader und Antwortheader

In Verbindung stehende Artikel

Mehr sehen