Heim > Web-Frontend > js-Tutorial > jQuery domänenübergreifende Problemlösung_jquery

jQuery domänenübergreifende Problemlösung_jquery

WBOY
Freigeben: 2016-05-16 15:47:40
Original
1641 Leute haben es durchsucht

Anfordern von Daten in verschiedenen Domänen über XMLHTTPRquest Es stellt sich heraus, dass der domänenübergreifende Zugriff von js eine Funktion mit einem Verarbeitungspfad „/test“ im Hintergrund ist. Die spezifischen Lösungen werden im Folgenden vorgestellt.

Funktion für Hintergrundverarbeitungspfad „/test“:

Code kopieren Der Code lautet wie folgt:

//Pfadverarbeitung
app.get("/test",user.test);
//Verarbeitungsfunktion
exports.test=function(req,res){
res.end("alert('JS Cross-Domain Access')");
};

Wenn es eine externe Webseite gibt, die auf den Inhalt unter dem Pfad „/test“ zugreifen muss, kann über eine JS-Skriptdatei domänenübergreifend darauf zugegriffen werden:

Code kopieren Der Code lautet wie folgt:

//Verarbeitungsfunktion
<script><br> Funktionsmethode(Daten){<br> console.log(data);<br> }<br> </script>
//Domänenübergreifender Zugriff

Das Ergebnis wird in einem Fenster auf der aktuellen Webseite angezeigt:

Implementierung des domänenübergreifenden JSONP-Zugriffs in jQuery:

Es gibt auch eine Funktion im Hintergrund, die den Pfad „/test“ verwaltet:

//路径处理
app.get("/test",user.test);
//处理函数
exports.test=function(req,res){
 res.end("method("+JSON.stringify({mes:"跨域访问成功!"})+")");
};
 外部有一个网页需要访问路径”/test“下的内容,通过JSONP来实现跨域访问:

//引入跨域访问中的jQuery函数库
<script src="http://localhost:3000/js/jquery-1.9.1.min.js"></script>
//jQuery中JSONP跨域访问
<script>
  $.ajax({
    url:"http://localhost:3000/test",
    type:"get",
    success:function(data){
      $("body").append(data.mes);
    },
    dataType:"jsonp",
    jsonpCallback:"method"
  });
</script>
Nach dem Login kopieren

Als Ergebnis werden die folgenden Informationen auf der aktuellen Webseite angezeigt:

Anhand des obigen Codes können wir erkennen, dass der Unterschied zwischen dem domänenübergreifenden JSOPN-Zugriff und dem domänenübergreifenden ursprünglichen JS-Zugriff darin besteht, dass JSONP keine Funktionen schreiben muss, um den domänenübergreifenden Zugriff zu handhaben (z. B. die in verwendete Methodenfunktion). Beim Zugriff auf eine Domäne wird automatisch eine Funktion für den domänenübergreifenden Zugriff erstellt.

Vorteile des domänenübergreifenden JSONP-Zugriffs:

1. Es unterliegt nicht der gleichen Ursprungsrichtlinie wie die vom XMLHTTPRequest-Objekt implementierte AJAX-Anfrage

2. Es ist besser kompatibel und erfordert keine XMLHTTPRequest- oder ActiveX-Unterstützung

3. Nachdem die Anfrage abgeschlossen ist, kann das Ergebnis durch Aufrufen der Callback-Methode zurückgegeben werden.

Nachteile des domänenübergreifenden JSONP-Zugriffs:

1. Es unterstützt nur GET-Anfragen und nicht POST und andere Arten von Anfragen

2. Es unterstützt nur domänenübergreifende HTTP-Anfragen und kann das Problem, wie JavaScript-Aufrufe zwischen zwei Seiten in verschiedenen Domänen durchgeführt werden, nicht lösen.

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