Comment configurer Ajax pour obtenir un accès inter-domaines-js tutoriel-php.cn

Comment configurer Ajax pour obtenir un accès inter-domaines

php中世界最好的语言

Libérer： 2018-04-02 16:01:48

original

1399 Les gens l'ont consulté

Cette fois, je vais vous montrer comment configurer Ajax pour obtenir un accès inter-domaines. Quelles sont les précautions pour configurer Ajax pour obtenir un accès inter-domaines. Voici des cas pratiques, prenons un. regarder.

L'accès inter-domaines Ajax est un vieux problème. Il existe de nombreuses solutions. La méthode la plus couramment utilisée est la méthode JSONP qui est une méthode non officielle, et cette méthode ne prend en charge que la méthode GET, qui n'est pas aussi sûre. comme méthode POST.

Même si vous utilisez la méthode jsonp de jQuery et définissez le type sur POST, il deviendra automatiquement GET.

Description officielle du problème :

"script" : évalue la réponse en tant que JavaScript et la renvoie sous forme de texte brut. Désactive la mise en cache en ajoutant une requête. paramètre de chaîne, "_=[TIMESTAMP]", à l'URL, sauf si l'option de cache est définie sur true : Cela transformera les POST en GET pour les requêtes de domaine distant.

if. Pour utiliser la méthode POST sur plusieurs domaines, vous pouvez créer une iframe cachée pour obtenir le même principe que le téléchargement d'images ajax, mais cela sera plus gênant.

Par conséquent, il est relativement simple d'obtenir un accès inter-domaines en définissant Access-Control-Allow-Origin.

Par exemple : le nom de domaine du client est www.client.com et le nom de domaine demandé est www.server.com

Si vous utilisez directement ajax pour accéder, il y aura ce qui suit erreur

XMLHttpRequest ne peut pas charger http://www.server.com/server.PHP Aucun en-tête 'Access-Control-Allow-Origin' n'est présent sur la ressource.Origin' demandée. L'accès à http://www.client .com' n'est donc pas autorisé

Ajoutez

// 指定允许其他域名访问 
header('Access-Control-Allow-Origin:*'); 
// 响应类型 
header('Access-Control-Allow-Methods:POST'); 
// 响应头设置 
header('Access-Control-Allow-Headers:x-requested-with,content-type');

Copier après la connexion

à l'en-tête de réponse demandé pour obtenir un accès inter-domaines ajax POST.

Le code est le suivant :

client.html Chemin : http://www.client.com/client.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
 <head> 
 <meta http-equiv="content-type" content="text/html;charset=utf-8"> 
 <title> 跨域测试 </title> 
 <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> 
 </head> 
 <body> 
 <p id="show"></p> 
 <script type="text/javascript"> 
 $.post("http://www.server.com/server.php",{name:"fdipzone",gender:"male"}) 
 .done(function(data){ 
 document.getElementById("show").innerHTML = data.name + ' ' + data.gender; 
 }); 
 </script> 
 </body> 
</html>

Copier après la connexion

server.php Chemin : http://www.client.com/client.html /www.server.com/server.php

<?php 
$ret = array( 
 &#39;name&#39; => isset($_POST['name'])? $_POST['name'] : '', 
 'gender' => isset($_POST['gender'])? $_POST['gender'] : '' 
); 
header('content-type:application:json;charset=utf8'); 
header('Access-Control-Allow-Origin:*'); 
header('Access-Control-Allow-Methods:POST'); 
header('Access-Control-Allow-Headers:x-requested-with,content-type'); 
echo json_encode($ret); 
?>

Copier après la connexion

Access-Control-Allow-Origin :* signifie autoriser l'accès inter-domaines à partir de n'importe quel domaine name

Si nécessaireSpécifiez un nom de domaine pour autoriser l'accès entre domaines, remplacez simplement Access-Control-Allow-Origin:* par Access-Control-Allow-Origin:Autorisé nom de domaine

Par exemple : header(' Access-Control-Allow-Origin: http://www.client.com');

Si vous en avez besoin définissez plusieurs noms de domaine pour autoriser l'accès, vous devez utiliser php pour le gérer

Par exemple, autoriser www.client.com et www.client2.com à avoir un accès inter-domaines

server.php est modifié en

<?php 
$ret = array( 
 &#39;name&#39; => isset($_POST['name'])? $_POST['name'] : '', 
 'gender' => isset($_POST['gender'])? $_POST['gender'] : '' 
); 
header('content-type:application:json;charset=utf8'); 
$origin = isset($_SERVER['HTTP_ORIGIN'])? $_SERVER['HTTP_ORIGIN'] : ''; 
$allow_origin = array( 
 'http://www.client.com', 
 'http://www.client2.com' 
); 
if(in_array($origin, $allow_origin)){ 
 header('Access-Control-Allow-Origin:'.$origin); 
 header('Access-Control-Allow-Methods:POST'); 
 header('Access-Control-Allow-Headers:x-requested-with,content-type'); 
} 
echo json_encode($ret); 
?>

Copier après la connexion

Adresse de téléchargement du code source : http://xiazai.jb51.net/201702/yuanma/demo( jb51.net)

Voici les ajouts d'autres internautes :

Utilisation récente de cocos2d - Lors de la création de jeux avec js,
une erreur se produit lors de l'utilisation locale d'une demande d'accès inter-domaines ajax :

XMLHttpRequest ne peut pas chargerhttp://www.zjblogs.com/. Aucun en-tête 'Access-Control-Allow-Origin' n'est présent sur la ressource demandée. L'origine 'null' n'est donc pas autorisée à accéder.

J'ai vérifié en ligne et la solution est la suivante :

1. Si l'URL demandée est une page aspx, vous devez ajouter du code à la page aspx : Response.AddHeader("Access-Control-Allow -Origin", "*");

2. Si l'URL demandée est une page PHP, vous devez ajouter du code à la page PHP：header("Access-Control-Allow-Origin: *") ;

3. Si l'URL demandée est une page html statique, vous devez ajouter le code de la balise méta à la page :

Le * ici signifie que tous les noms de domaine sont accessibles. Si le serveur peut déterminer à quels noms de domaine doivent accéder, il est préférable de remplacer le « * » dans le code ci-dessus par un nom de domaine spécifique. Cela peut améliorer la sécurité en conséquence.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Utiliser Ajax pour implémenter les fonctions d'enregistrement et de téléchargement d'avatar

Comment utiliser Ajax et $.ajax

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!