Maison > interface Web > js tutoriel > 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
Libérer: 2024-10-29 19:37:30
original
290 Les gens l'ont consulté

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>
Copier après la connexion
  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>
Copier après la connexion
  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>
Copier après la connexion
  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>
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal