Maison  >  Article  >  interface Web  >  Comment effectuer des requêtes JSONP inter-domaines en JavaScript sans jQuery ?

Comment effectuer des requêtes JSONP inter-domaines en JavaScript sans jQuery ?

Susan Sarandon
Susan Sarandonoriginal
2024-10-29 19:37:30181parcourir

How to Make Cross-Domain JSONP Requests in JavaScript Without jQuery?

Faire des requêtes JSONP inter-domaines en JavaScript sans bibliothèques externes

JSONP (JSON with Padding) est une technique qui permet des requêtes inter-domaines en ajoutant une fonction de rappel à l'URL de la demande. La fonction de rappel est définie par le client et est exécutée par le serveur dès réception réussie de la requête.

Comment faire une requête JSONP sans jQuery

Pour faire une Requête JSONP sans jQuery, vous pouvez suivre ces étapes :

  1. Créer une fonction de rappel : Définir une fonction qui sera appelée lorsque le serveur répond avec les données JSON. Cette fonction sera fournie avec les données en argument.
<code class="javascript">function foo(data) {
    // Process the JSON data
}</code>
  1. Construisez l'URL JSONP : Créez l'URL de la requête JSONP en ajoutant la fonction de rappel nom comme paramètre de requête.
<code class="javascript">const url = '//example.com/path/to/jsonp?callback=foo';</code>
  1. Créez un élément de script : Créez un élément de script et définissez son attribut src sur l'URL JSONP.
<code class="javascript">const script = document.createElement('script');
script.src = url;</code>
  1. Ajoutez l'élément de script au DOM : Ajoutez l'élément de script à l'en-tête du document. Cela déclenchera la requête auprès du serveur.
<code class="javascript">document.head.appendChild(script);
// or document.getElementsByTagName('head')[0].appendChild(script) in older browsers</code>

Une fois que le serveur aura répondu avec les données JSON, la fonction de rappel sera exécutée et vous pourrez utiliser les données fournies pour remplir votre application.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn