Résumer trois méthodes d'implémentation inter-domaines Ajax en PHP-tutoriel php-php.cn

Résumer trois méthodes d'implémentation inter-domaines Ajax en PHP

PHPz

Libérer： 2023-04-11 15:10:01

original

927 Les gens l'ont consulté

Avec la popularité de la séparation front-end et back-end, il est devenu courant dans le développement Web que le front-end appelle l'interface back-end et obtienne des données via la technologie Ajax.

Cependant, en raison de la même politique d'origine du navigateur, les pages Web provenant de sources différentes (différents protocoles, noms de domaine ou ports) ne peuvent pas accéder les unes aux autres au DOM et aux cookies, ce qui fait de l'accès entre domaines une exigence très courante. Il existe de nombreuses façons de résoudre ce problème.

Cet article présentera trois façons d'implémenter Ajax multi-domaines en PHP.

1. JSONP

JSONP (JSON with Padding) est une solution très populaire lorsque le front-end lance des requêtes inter-domaines. Il s'agit en fait d'un moyen de « tromper » le navigateur, en profitant du fait que la balise <script> n'a aucune restriction inter-domaines pour obtenir un accès inter-domaines. Son principe est de générer dynamiquement un extrait de code JavaScript pour répondre à la requête côté serveur. L'extrait de code appellera une fonction JavaScript avec un nom spécifique (nom de la fonction de rappel) et lui transmettra en paramètre les données traitées par le serveur. cette fonction. Cela permet d'obtenir l'effet d'un accès inter-domaines. <script> 标签没有跨域限制的特点来实现跨域访问。它的原理就是通过在服务端动态生成用于响应请求的 JavaScript 代码片段，该代码片段会调用一个特定名称（回调函数名）的 JavaScript 函数，并将服务端处理的数据作为参数传递给此函数，从而达到跨域访问的效果。

JSONP 的使用方式如下：

客户端代码：

function handleJsonp(data) {
  console.log(data);
}
const script = document.createElement('script');
script.src = 'http://example.com/api?callback=handleJsonp';
document.head.appendChild(script);

Copier après la connexion

服务端代码：

<?php
$data = array(&#39;foo&#39; => 'bar');
$callback = $_GET['callback'];
echo sprintf('%s(%s);', $callback, json_encode($data));
?>

Copier après la connexion

在这段代码中，服务端的返回结果是一个包含回调函数调用的 JavaScript 代码片段，客户端得到数据后会自动执行回调函数，并将服务端返回的数据作为回调函数的参数。

JSONP 的优点是兼容性好，兼容性只受到浏览器支持 <script> 标签的程度限制，但缺点是存在安全性问题，因为回调函数是在客户端执行的，我们无法保证此函数所执行的是我们期望的逻辑，如果恶意回调函数传递了恶意代码，就会存在被 XSS 攻击的风险。

二、代理模式

代理模式是另一种比较流行的跨域解决方案。它的基本思路是在服务端设置一个代理访问指定网址，然后将从代理服务器获取到的数据返回给客户端。通过这种方式，客户端可以直接访问同源的代理服务器，代理服务器再去访问跨域的目标服务器，并将目标服务器返回的数据进行中转。

代理模式的使用方式如下：

客户端代码：

fetch('http://example.com/proxy_api')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error(error));

Copier après la connexion

服务端代码：

<?php
$url = &#39;http://example.com/api&#39;;
$data = json_decode(file_get_contents($url), true);
echo json_encode($data);
?>

Copier après la connexion

在这段代码中，客户端的请求被发往代理服务器，代理服务器在得到目标服务器返回的数据后将之返回给客户端，这样就实现了客户端对跨域服务的访问。

代理模式的优点是安全性好，因为在客户端只会访问同源的代理服务器，代理服务器再去访问跨域的目标服务器，从而有效避免了跨域访问带来的安全风险，但缺点是需要额外开发服务器端代码，增加了额外的工作量和开发成本。

三、CORS

CORS 是目前最流行的跨域访问解决方案。它通过在服务端设置响应头来告诉客户端是否允许跨域访问，从而实现跨域访问安全控制。

CORS 的使用方式如下：

客户端代码：

fetch('http://example.com/api', {
  mode: 'cors'
})
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error(error));

Copier après la connexion

服务端代码：

<?php
header(&#39;Access-Control-Allow-Origin: *&#39;);
$data = array(&#39;foo&#39; => 'bar');
echo json_encode($data);
?>

Copier après la connexion

在这段代码中，服务端设置了 Access-Control-Allow-Origin:* 响应头，表示允许所有来源访问该接口，客户端通过在请求中设置 mode: 'cors'

JSONP s'utilise comme suit :

Code client :

rrreee

Code serveur :

rrreee Dans ce code, le résultat renvoyé par le serveur est un fragment de code JavaScript qui contient un appel de fonction de rappel une fois que le client a obtenu les données, il exécutera automatiquement la fonction de rappel et utilisera les données renvoyées par le serveur comme paramètre du. fonction de rappel.

L'avantage de JSONP est une bonne compatibilité. La compatibilité n'est limitée que par la mesure dans laquelle le navigateur prend en charge la balise <script>. Cependant, l'inconvénient est qu'il existe des problèmes de sécurité dus au rappel. est exécutée sur le client. , nous ne pouvons pas garantir que cette fonction exécute la logique attendue. Si la fonction de rappel malveillante transmet du code malveillant, il y aura un risque d'être attaqué par XSS. 🎜🎜2. Mode proxy 🎜🎜Le mode proxy est une autre solution inter-domaines populaire. Son idée de base est de configurer un proxy sur le serveur pour accéder à l'URL spécifiée, puis de renvoyer les données obtenues du serveur proxy au client. De cette manière, le client peut accéder directement au serveur proxy à partir de la même origine, et le serveur proxy accède ensuite au serveur cible inter-domaines et transmet les données renvoyées par le serveur cible. 🎜🎜Le mode proxy s'utilise de la manière suivante : 🎜