suchen

Heim >Web-Frontend >js-Tutorial >Domainübergreifende Anfragen: Die Ajax-JSONP-Nutzungslösung von jQuery

Domainübergreifende Anfragen: Die Ajax-JSONP-Nutzungslösung von jQuery

高洛峰
高洛峰Original
2017-01-12 09:45:32871Durchsuche

Das direkte Ausführen der Fehlermethode hat zu einem Fehler geführt. Ajax JSONP wurde zuvor nicht verwendet. Das Verständnis davon ähnelt dem von gewöhnlichen Ajax-Anfragen, und ich habe kein tieferes Verständnis dafür, dass dieser Fehler aufgetreten ist Das mehrmalige Debuggen (überprüfen Sie den Hintergrundcode und den js-Teil der Eigenschaftseinstellungen) funktioniert immer noch nicht, was mich sehr überrascht und verwirrt. Aus diesem Grund habe ich beschlossen, die Verwendung von Ajax JSONP sorgfältig zu studieren und die Lernerfahrung des abschließenden erfolgreichen Tests mit allen zu teilen.
Veröffentlichen Sie zunächst den Code, der erfolgreich ausgeführt werden kann:
(Seitenteil) 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
<title>Untitled Page</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function(){ 
$.ajax({ 
type : "get", 
async:false, 
url : "ajax.ashx", 
dataType : "jsonp", 
jsonp: "callbackparam",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback) 
jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名 
success : function(json){ 
alert(json); 
alert(json[0].name); 
}, 
error:function(){ 
alert(&#39;fail&#39;); 
} 
}); 
var a="firstName Brett"; 
alert(a); 
}); 
</script> 
</head> 
<body> 
</body> 
</html>

(Handler-Teil) 

<%@ WebHandler Language="C#" Class="ajax" %> 
using System; 
using System.Web; 
public class ajax : IHttpHandler { 
public void ProcessRequest (HttpContext context) { 
context.Response.ContentType = "text/plain"; 
string callbackFunName = context.Request["callbackparam"]; 
context.Response.Write(callbackFunName + "([ { name:\"John\"} ] )"); 
} 
public bool IsReusable { 
get { 
return false; 
} 
} 
}

Ajax-Anforderungsparameterbeschreibung:
dataType String
Der Datentyp, der voraussichtlich vom Server zurückgegeben wird. Wenn nicht angegeben, trifft jQuery automatisch intelligente Entscheidungen basierend auf den MIME-Informationen des HTTP-Pakets. Beispielsweise wird der XML-MIME-Typ als XML erkannt. In 1.4 generiert JSON ein JavaScript-Objekt und das Skript führt das Skript aus. Die vom Server zurückgegebenen Daten werden dann basierend auf diesem Wert analysiert und an die Rückruffunktion übergeben. Verfügbare Werte:
"xml": Gibt ein XML-Dokument zurück, das mit jQuery verarbeitet werden kann.
„html“: Gibt reine Text-HTML-Informationen zurück; das enthaltene Skript-Tag wird ausgeführt, wenn es in den Dom eingefügt wird.
"script": Gibt Nur-Text-JavaScript-Code zurück. Ergebnisse werden nicht automatisch zwischengespeichert. Es sei denn, der Parameter „Cache“ ist gesetzt. '''Hinweis:''''Bei Remote-Anfragen (nicht unter derselben Domäne) werden alle POST-Anfragen in GET-Anfragen umgewandelt. (Da zum Laden das DOM-Skript-Tag verwendet wird)
"json": Gibt JSON-Daten zurück.
"jsonp": JSONP-Format. Beim Aufrufen einer Funktion im JSONP-Formular, z. B. „myurl?callback=?“, ersetzt jQuery automatisch ? durch den richtigen Funktionsnamen, um die Callback-Funktion auszuführen.
"text": Gibt eine Nur-Text-Zeichenfolge zurück.
jsonp String
Schreibt den Namen der Rückruffunktion in einer JSONP-Anfrage neu. Dieser Wert wird verwendet, um den „Callback“-Teil des URL-Parameters in einer GET- oder POST-Anfrage zu ersetzen, z. B. „callback=?“ führt dazu, dass „onJsonPLoad=?“ übergeben wird Der Server.
jsonpCallback String
Geben Sie einen Callback-Funktionsnamen für die JSONP-Anfrage an. Dieser Wert wird anstelle des von jQuery automatisch generierten zufälligen Funktionsnamens verwendet. Dies wird hauptsächlich verwendet, um jQuery die Generierung eindeutiger Funktionsnamen zu ermöglichen, um die Verwaltung von Anforderungen sowie die Bereitstellung von Rückruffunktionen und Fehlerbehandlung zu erleichtern. Sie können diesen Rückruffunktionsnamen auch angeben, wenn der Browser GET-Anfragen zwischenspeichern soll.
Der Hauptunterschied zwischen Ajax JSONP und gewöhnlichen Ajax-Anfragen besteht in der Verarbeitung der Anfrage-Antwort-Ergebnisse. Das im obigen Code angezeigte Antwortergebnis lautet:
success_jsonpCallback([ { name: „John“} ] ); – Tatsächlich wird die JSONP-Rückruffunktion success_jsonpCallback aufgerufen und die Zeichenfolge oder JSON übergeben, auf die geantwortet werden soll hier Methode (als Parameterwert), ihre zugrunde liegende Implementierung, eine grobe Schätzung sollte sein: 

function success_jsonpCallback(data) 
{ 
success(data); 
}

Für weitere domänenübergreifende Anfragen zur Verwendung von Ajax JSONP von jQuery und verwandte Artikel achten Sie bitte auf PHP Chinesische 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：Detaillierte Erläuterung der asynchronen Verarbeitung von Json-Daten durch jQuery AjaxNächster Artikel：Detaillierte Erläuterung der asynchronen Verarbeitung von Json-Daten durch jQuery Ajax

In Verbindung stehende Artikel

Mehr sehen