Heim > Artikel > Backend-Entwicklung > Lösung für das Problem des Cookie-Verlusts im domänenübergreifenden Ajax-Zugriff_AJAX

Lösung für das Problem des Cookie-Verlusts im domänenübergreifenden Ajax-Zugriff_AJAX

小云云Original: 2018-01-08 13:07:202453Durchsuche

Dieser domänenübergreifende Ajax-Zugriff kann mithilfe der JSONP-Methode oder durch Festlegen von Access-Control-Allow-Origin erreicht werden, um domänenübergreifenden Zugriff zu erreichen. Weitere Informationen finden Sie in dem Artikel, den ich geschrieben habe Vor dem Artikel „Ajax-Einstellung Access-Control“ -Allow-Origin zum Erreichen eines domänenübergreifenden Zugriffs“ wird hauptsächlich die Lösung für das Problem des Cookie-Verlusts beim domänenübergreifenden Ajax-Zugriff vorgestellt. Freunde in Not können sich darauf beziehen. Ich hoffe, es kann helfen alle.

1.ajax-domänenübergreifender Zugriff, Cookie-Verlust

Erstellen Sie zunächst zwei Testdomänennamen

a.fdipzone.com als Client-Domänennamen

b. fdipzone.com als Server-Domänenname

Testcode

setcookie.PHP wird verwendet, um das Server-Cookie zu setzen

<?php
setcookie(&#39;data&#39;, time(), time()+3600);
?>

server.php wird verwendet vom Client angefordert

<?php
$name = isset($_POST[&#39;name&#39;])? $_POST[&#39;name&#39;] : &#39;&#39;;
$ret = array(
 &#39;success&#39; => true,
 'name' => $name,
 'cookie' => isset($_COOKIE['data'])? $_COOKIE['data'] : ''
);
// 指定允许其他域名访问
header('Access-Control-Allow-Origin:http://a.fdipzone.com');
// 响应类型
header('Access-Control-Allow-Methods:POST'); 
// 响应头设置
header('Access-Control-Allow-Headers:x-requested-with,content-type');
header('content-type:application/json');
echo json_encode($ret);
?>

test.html Client-Anfrageseite

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html;charset=utf-8">
 <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
 <title> ajax 跨域访问cookie丢失的解决方法 </title>
 </head>
 <body>
 <script type="text/javascript">
 $(function(){
  $.ajax({
   url: 'http://b.fdipzone.com/server.php', // 跨域
   dataType: 'json',
   type: 'post',
   data: {'name':'fdipzone'},
   success:function(ret){
    if(ret['success']==true){
     alert('cookie:' + ret['cookie']);
    }
   }
  });
 })
 </script>
 </body>
</html>

Führen Sie zunächst http://b.fdipzone.com/setcookie.php aus, um ein serverseitiges Cookie zu erstellen .

Dann http://a.fdipzone.com/test.html ausführen

Ausgabe

{"success":true,"name":"fdipzone","cookie":""}

Cookie konnte nicht abgerufen werden.

2. Lösung

Client

Setzen Sie das withCredentials-Attribut bei der Anfrage auf true, damit Sie angeben können, dass Anmeldeinformationen für eine bestimmte Anfrage gesendet werden sollen . Wenn der Server eine Anfrage mit Anmeldeinformationen erhält, antwortet er mit den folgenden HTTP-Headern.

Serverseite

Header festlegen

Anfragen mit Verifizierungsinformationen zulassen

header("Access-Control-Allow-Credentials:true");

test.html wird wie folgt geändert

server.php wird wie folgt geändert

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <meta http-equiv="content-type" content="text/html;charset=utf-8">
 <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
 <title> ajax 跨域访问cookie丢失的解决方法 </title>
 </head>
 <body>
 <script type="text/javascript">
 $(function(){
  $.ajax({
   url: 'http://b.fdipzone.com/server.php', // 跨域
   xhrFields:{withCredentials: true}, // 发送凭据
   dataType: 'json',
   type: 'post',
   data: {'name':'fdipzone'},
   success:function(ret){
    if(ret['success']==true){
     alert('cookie:' + ret['cookie']);
    }
   }
  });
 })
 </script>
 </body>
</html>

Folgen Sie den vorherigen Schritten und die Anfrage wird zurückgegeben

<?php
$name = isset($_POST[&#39;name&#39;])? $_POST[&#39;name&#39;] : &#39;&#39;;
$ret = array(
 &#39;success&#39; => true,
 'name' => $name,
 'cookie' => isset($_COOKIE['data'])? $_COOKIE['data'] : ''
);
// 指定允许其他域名访问
header('Access-Control-Allow-Origin:http://a.fdipzone.com');
// 响应类型
header('Access-Control-Allow-Methods:POST'); 
// 响应头设置
header('Access-Control-Allow-Headers:x-requested-with,content-type');
// 是否允许请求带有验证信息
header('Access-Control-Allow-Credentials:true');
header('content-type:application/json');
echo json_encode($ret);
?>

Das Cookie wurde erfolgreich abgerufen

{"success":true,"name":"fdipzone","cookie":"1484558863"}

3. Vorsichtsmaßnahmen

1. Wenn der Client das withCredentials-Attribut auf true setzt, der Server jedoch Access-Control-Allow-Credentials:true nicht setzt, wird während der Anfrage ein Fehler zurückgegeben.

2. Nachdem der Server-Header Access-Control-Allow-Credentials: true gesetzt hat, kann Access-Control-Allow-Origin nicht auf * gesetzt werden und muss auf einen Domänennamen gesetzt werden, andernfalls ein Fehler wird zurückgegeben.

XMLHttpRequest cannot load http://b.fdipzone.com/server.php. Credentials flag is 'true', but the 'Access-Control-Allow-Credentials' header is ''. It must be 'true' to allow credentials. Origin 'http://a.fdipzone.com' is therefore not allowed access.

Sehen wir uns die Lösung für das Problem an, dass COOKIE nicht mit domänenübergreifenden Ajax-Anfragen eingebracht werden kann

XMLHttpRequest cannot load http://b.fdipzone.com/server.php. A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' heade

Native Ajax-Anfragemethode:

jquerys Ajax-Post-Methodenanfrage:

var xhr = new XMLHttpRequest(); 
xhr.open("POST", "http://xxxx.com/demo/b/index.php", true); 
xhr.withCredentials = true; //支持跨域发送cookies
xhr.send();

Serverseitige Einstellungen:

 $.ajax({
    type: "POST",
    url: "http://xxx.com/api/test",
    dataType: 'jsonp',
    xhrFields: {
      withCredentials: true
    },
   crossDomain: true,
   success:function(){
  },
   error:function(){
 }
})

Verwandte Empfehlungen:

header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: http://www.xxx.com");

JS implementiert Ajax-Cross-Domain-Request-Flask-Antwort Inhalt

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

Detaillierte Beispiele für die Prinzipien domänenübergreifender Ajax-Anfragen

Das obige ist der detaillierte Inhalt vonLösung für das Problem des Cookie-Verlusts im domänenübergreifenden Ajax-Zugriff_AJAX. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

php flask jquery ajax html Cookie JS http Access

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：PHP-Sortieralgorithmus, Serieneinfügung, Sortierung, BeispielfreigabeNächster Artikel：PHP-Sortieralgorithmus, Serieneinfügung, Sortierung, Beispielfreigabe

In Verbindung stehende Artikel

Mehr sehen