Heim > Artikel > Web-Frontend > JS implementiert domänenübergreifende Ajax-Request-Flask-Antwortinhalte

JS implementiert domänenübergreifende Ajax-Request-Flask-Antwortinhalte

小云云Original: 2018-01-03 16:26:121759Durchsuche

Die Ajax-Methode ist gut und die Website fühlt sich hochwertig an. Aufgrund der Einschränkungen von Js kann domänenübergreifendes Ajax jedoch nicht implementiert werden. Die Voraussetzung ist, dass Sie in der Lage sein müssen um die Reaktion auf der Kolbenseite zu steuern. In diesem Artikel wird hauptsächlich die JS-Implementierung des domänenübergreifenden Antwortinhalts von Ajax vorgestellt. Ich hoffe, dass er für alle hilfreich ist.

Haupttechnologie:

Ändern Sie den entsprechenden Header des Servers, sodass er jedem Domänennamen entsprechen kann. und legt den Antwortheader so fest, dass er der POST-Methode entsprechen kann.

Implementierungscode:

Hier ist der Flaschencode:

from flask import make_response
@app.route(&#39;/test&#39;,methods=[&#39;get&#39;,&#39;post&#39;])
def Test():
 if request.method==&#39;GET&#39;:
  rst = make_response(&#39;aaa&#39;)
  rst.headers[&#39;Access-Control-Allow-Origin&#39;] = &#39;*&#39; #任意域名
  return rst
 else:
  rst = make_response(&#39;bbb&#39;)
  rst.headers[&#39;Access-Control-Allow-Origin&#39;] = &#39;*&#39;
  rst.headers[&#39;Access-Control-Allow-Methods&#39;] = &#39;POST&#39; #响应POST
  return rst

HTML-Testcode:

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Title</title>
</head>
<body>
<span id="ss">test get</span>
<button onclick="getAjax()">click</button>

 <p id="time">test post</p>
 <input type="submit" value="click" onclick="getPostAjax()">


<script>
 function getPostAjax() {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange=function () {
   if(xmlhttp.readyState=4 && xmlhttp.status ==200 ) {
    document.getElementById("time").innerText = xmlhttp.responseText;
   }
  }

  xmlhttp.open("POST","http://localhost:5000/test",true);
  xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
  #这句话可以发送post数据，没有此句post的内容无法传递
  xmlhttp.send();


 }

 function getAjax() {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange=function () {
   if(xmlhttp.readyState==4 && xmlhttp.status == 200){
    document.getElementById("ss").innerHTML=xmlhttp.responseText;
   }
  }
  xmlhttp.open("GET","http://localhost:5000/test",true);
  xmlhttp.send();
 }
</script>
</body>
</html>

Antwortheader kann nicht gesteuert werden

In dieser Situation kann die Get-Anfrage mit jquery und post abgeschlossen werden, es kann nichts unternommen werden.

Hast du es schon gelernt? Beeilen Sie sich und probieren Sie es aus.

Verwandte Empfehlungen:

Die perfekte Lösung für domänenübergreifende Ajax-Anfragen, die COOKIE nicht bereitstellen kann

Eine detaillierte Erklärung der Prinzipien von Ajax-Cross-Domain-Anfragen mit Beispielen

Erklären Sie vier Methoden für AJAX-Cross-Domain-Anfragedaten

Das obige ist der detaillierte Inhalt vonJS implementiert domänenübergreifende Ajax-Request-Flask-Antwortinhalte. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

flask jquery ajax html Cookie JS

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：Verwenden Sie js, um die Inhaltsinstanzfreigabe von Pseudoelementen zu erhaltenNächster Artikel：Verwenden Sie js, um die Inhaltsinstanzfreigabe von Pseudoelementen zu erhalten

In Verbindung stehende Artikel

Mehr sehen