Heim > Web-Frontend > js-Tutorial > Ajax-Methode zur domänenübergreifenden Implementierung

Ajax-Methode zur domänenübergreifenden Implementierung

php中世界最好的语言
Freigeben: 2018-04-04 14:22:23
Original
979 Leute haben es durchsucht

Dieses Mal werde ich Ihnen die Implementierungsmethode für die domänenübergreifende Ajax-Implementierung vorstellen. Hier sind praktische Fälle.

Einführung in AjaxAJAX ist „Asynchrones

Javascript

und XML“ (Asynchrones JavaScript). und XML) bezeichnet eine Webentwicklungstechnologie zur Erstellung interaktiver Webanwendungen. AJAX = Asynchrones JavaScript und XML (eine Teilmenge der Standard Universal Markup Language).

AJAX ist eine Technologie zur Erstellung schneller, dynamischer Webseiten.

AJAX ermöglicht die asynchrone Aktualisierung von Webseiten durch den Austausch einer kleinen Datenmenge mit dem Server im Hintergrund. Das bedeutet, dass Teile einer Webseite aktualisiert werden können, ohne dass die gesamte Seite neu geladen werden muss.

Herkömmliche Webseiten (die kein AJAX verwenden) müssen die gesamte Webseite neu laden, wenn der Inhalt aktualisiert werden muss.

Kommen wir zur SacheVor zwei Tagen fragte mich xz, ob ich wüsste, wie man domänenübergreifende Aufrufe mit Ajax umsetzt, denn Ich hatte noch nie von diesem Konzept gehört, daher wissen wir auch, wie man es umsetzt. xz sagte, dass es mehrere Möglichkeiten gibt, Ajax domänenübergreifend aufzurufen. Eine davon ist die iframe-Methode, die durch Festlegen von document.domain erreicht wird, und die andere wird durch Festlegen von jsonp erreicht. Ich habe die Informationen in den letzten zwei Tagen überprüft und einige Demos geschrieben, die ich unten notieren werde.

Ich habe drei Websites lokal erstellt und Hostdateien eingerichtet, um Cross-Subdomain und Cross-Domain zu simulieren

coolkissbh.com

blog.coolkissbh.com

coolkiss.com

1. Was sind die Probleme mit domänenübergreifenden Ajax-Aufrufen Die Seite unter coolkissbh.com verwendet $ . Aufrufe der Seite blog.coolkissbh.com

domänenübergreifende Anfrage, IE 7 und 8 melden den Fehler „Zugriff verweigert“

IE 6.0 greift auf Informationen zu, die nicht unter seiner Kontrolle stehen Sicherheitsrisiko. Möchten Sie

fortfahren
?EingabeaufforderungsfeldFirefox meldet keinen Fehler, stellt aber keine Anfrage

2. Methode zur domänenübergreifenden Ajax-Implementierung

1. Ajax über Subdomains hinweg implementieren

Anforderungen: Implementieren Sie die Seite von coolkissbh.com, um die Seite asynchron anzufordern unter blog.coolkissbh.com

Implementierungsmethode: Betten Sie mithilfe von iframe eine Seite unter blog.coolkissbh.com ein, z. B. AjaxProxy.aspx, indem Sie das src-Attribut des iframe festlegen, und verwenden Sie dann die Seite zum Anfordern von Ajax

AjaxProxy-Anfrage Nach Abschluss werden die zurückgegebenen Daten über das übergeordnete Objekt an die Hauptseite von coolkissbh.com zurückgesendet. Daher erfolgt die eigentliche asynchrone Anfrage weiterhin unter dem Domänennamen blog.coolkissbh.com

Hinweis: Die über diese Methode implementierte subdomänenübergreifende Ajax-Anfrage muss auf der Anfrageseite von coolkissbh.com und dem AjaxProxy erfolgen .aspx-Seite Legen Sie den gleichen Domänennamen fest, d Mit der oben genannten Methode meldet Firefox den Code „Ungültiger document.domain-Wert“: „Fehler 1009“, daher kann nur die zweite Methode

verwendet werden, um die zurückgegebenen Daten in der gesamten Domäne zu verarbeiten:

AjaxProxy.aspx gibt die Daten von Ajax zurück. Speichern Sie sie in einer globalen Variablen. Coolkissbh.com verwendet setInterval, um regelmäßig zu bestimmen, ob die Iframe-Seite geladen ist. Wenn der Ladevorgang abgeschlossen ist, erhalten Sie den globalen Variablenwert von AjaxProxy.aspx. Führen Sie dann eine andere Verarbeitung durch.


Hier liegt ein Problem vor: Ich hatte ursprünglich geplant, die übergeordnete Methode aufzurufen und die Daten zurückzugeben, nachdem die Ajax-Anfrage von AjaxProxy.aspx abgeschlossen ist, aber unter IE wird die „Berechtigung“ beim ersten Klicken angezeigt „Verweigert“-Fehler, klicken Sie erneut und es wird normal sein. Es gibt kein Problem in Firefox, ich weiß nicht warum.

2, Ajax in der gesamten Domain implementieren

Anforderungen: Implementieren Sie die Seite von coolkissbh.com, um die Seite unter coolkiss.com asynchron anzufordern

Implementierungsmethode: oben Es wird erwähnt, dass eine domänenübergreifende Verwendung nicht durch Festlegen der Domänenmethode erreicht werden kann. Dies kann jedoch mithilfe des Skript-Tags erreicht werden, indem das src-Attribut des Skript-Tags auf eine Seite unter dem Domainnamen coolkiss.com gesetzt und die Rückruffunktion an die Seite übergeben wird, zum Beispiel:

RequestAjax_CrossSite = function() {
var obj = $("#crossSitePage");
obj.attr("src", "http://coolkiss.com/CrossSite.aspx?callback=handleData3");
}
handleData3 = function(data) {
$("#ResponseData").html(data);
}
Nach dem Login kopieren

CrossSite.aspx gibt einen String zurück, übergibt die zurückgegebenen Daten zurück an den Rückruf, führt die Rückruffunktion aus und implementiert Ajax, zum Beispiel:

Response.Clear();
Response.Write(string.Format("{0}('{1}')", Request["callback"], ResponseData));
Response.End( );

Hinweis: Diese Methode kann auch zur Behandlung von subdomänenübergreifenden Ajax-Problemen verwendet werden, sie kann jedoch nicht die verschiedenen Status von Ajax-Aufrufen wie

3 abrufen jsonp von jquery Um domänenübergreifendes Ajax zu implementieren, ist das Prinzip tatsächlich das gleiche wie bei der zweiten Methode. Es unterstützt domänen- und subdomänenübergreifend

jquery 1.2 hat einen Aufruf von domänenübergreifendem Ajax hinzugefügt ist die $.getJSON-Funktion

Die Aufrufmethode lautet wie folgt:

Das Folgende ist die Seite unter coolkissbh.com

//使用jsonp实现跨全域
RequestAjax_JSONP = function() {
var obj = $("#crossSitePage");
$.getJSON("http://coolkiss.com/CrossSite.aspx?callback=?&t=" + Math.random(), function(data) {
//alert(data);
$("#ResponseData").html(data.content);
});
}
Nach dem Login kopieren

Hintergrundverarbeitungscode von coolkiss.com, Übergabe eines JSON-Objekts an den Rückruf:

public partial class CrossSite : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
LoadData_JSONP();
}
}
protected void LoadData_JSONP()
{
string responseData = "{content:\"hello world from coolkiss.com\"}";
if (Request["callback"] != null && !string.IsNullOrEmpty(Request["callback"]))
{
Response.Clear();
Response.Write(string.Format("{0}({1})", Request["callback"], responseData));
Response.End();
}
}
}
Nach dem Login kopieren

callback= wo? Es wird automatisch durch die Funktion (Daten) ersetzt.

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website.

Empfohlene Lektüre:

Wie JSONP mit dem domänenübergreifenden Ajax-Zugriff umgeht

Umleitung zur Anmeldung sofort nach dem Scheitern der Ajax+Sitzung Seite

Das obige ist der detaillierte Inhalt vonAjax-Methode zur domänenübergreifenden Implementierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage