Heim  >  Artikel  >  Web-Frontend  >  So implementieren Sie asynchrone domänenübergreifende Jquery-Ajax-Methoden

So implementieren Sie asynchrone domänenübergreifende Jquery-Ajax-Methoden

php中世界最好的语言
php中世界最好的语言Original
2018-03-15 11:00:351164Durchsuche

Dieses Mal werde ich Ihnen Jquery zeigen, wie Sie asynchrone domänenübergreifende Ajax-Implementierung durchführen und welche Vorsichtsmaßnahmen für die asynchrone domänenübergreifende Ajax-Implementierung von JQuery gelten. Das Folgende ist ein praktischer Fall , lass uns einen Blick darauf werfen.

Wie kann das asynchrone domänenübergreifende Problem von JS oder Jquery Ajax schnell gelöst werden? Der unten stehende Herausgeber wird Ihnen eine Methode zur schnellen Lösung des asynchronen domänenübergreifenden Jquery-Ajax-Problems vorstellen. Ich hoffe, dass sie für alle hilfreich ist. Folgen wir dem Herausgeber und werfen wir einen Blick darauf

In einer einfachen Zusammenfassung gibt es zwei Lösungen.

Eine davon ist die jsonp-Methode: Das heißt, wenn das Front-End eine asynchrone Anfrage sendet, fügen Sie relevante JSONP-Einstellungen oder -Konfigurationen hinzu ; das Back-End gibt eine Zeichenfolge in einem Format zurück, das von jsonp analysiert werden kann.

Aber die JSONP-Methode unterstützt nur die Get-Request-Methode und wird von neuen Browserversionen nicht unterstützt (neue Browserversionen stellen meist OPITION-Anfragen – asynchrone Sicherheits- Testanfragen). Daher die JSONP-Methode kann nicht bestanden werden),

Ich weiß hier nicht viel.

Eine davon ist die Cros-Methode Der Vorteil besteht darin, dass sie eine Verbindungs-Whitelist festlegen und die Anfragemethode einschränken kann (das heißt, es unterstützt die Mehrfachanforderungsmethode), die von allen gängigen Browsern unterstützt wird. Sprechen Sie hauptsächlich über die Implementierungsmethode:

Front-End: Das gleiche Format wie bei gewöhnlichen asynchronen Anforderungen, z. B.:

$.ajax({ 
   url :'http://localhost:8080/myProject/test' 
    type : "GET",//不局限于get 
   data:{"key1":value1,"key2":value2}, 
   async : true, 
   success : function(data) { 
    var dataObj=eval("("+data+")"); 
     console.log(dataObj); 
     
   }, 
   error : function(data) { 
    alert( "服务器连接失败 ajaxJsonp" ); 
   } 
  });

Backend: Hauptsächlich die Antwort-Header-Parameter festlegen

response.setHeader("Access-Control-Allow-Origin", "*");//设置可跨域资源共享的域名,只能设置一个具体的域名,但*可以代表所有 
response.setHeader("Access-Control-Allow-Methods","GET,POST,PUT,OPTIONS");//设置可跨域资源共享的请求方式 
  response.setHeader("Access-Control-Allow-Credentials","true"); 
  response.setHeader("Access-Control-Allow-Headers" ,"Origin, X-Requested-With, Content-Type, Accept");

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Für weitere spannende Informationen zahlen Sie bitte Beachten Sie auch andere verwandte Artikel auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Wie druckt das JQuery-Plug-In den Seiteninhalt?

Wie führt JQuery die Seite aus? löst standardmäßig Klickereignisse aus

So verwenden Sie On und Click in JQuery

Detaillierte Erläuterung der Wertübergabe im Baum Form in Laui

Das obige ist der detaillierte Inhalt vonSo implementieren Sie asynchrone domänenübergreifende Jquery-Ajax-Methoden. 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