Explication détaillée de JSON et JSONP dans JS-js tutoriel-php.cn

L'utilisation simple de json ne peut pas prendre en charge les demandes de ressources inter-domaines. Afin de résoudre ce problème, le protocole d'interaction de données jsonp doit être utilisé. Comme nous le savons tous, l'appel de fichiers js n'est pas limité selon qu'il s'agit d'un inter-domaine ou non. Par conséquent, si vous souhaitez accéder à des données inter-domaines via le côté Web pur, vous pouvez uniquement essayer d'encapsuler les données json dans. un fichier au format js sur le serveur distant pour que le client puisse l'appeler et poursuivre le traitement, c'est le principe du protocole jsonp.

JSON et JSONP

JSONP est un moyen d'envoyer des données JSON sans se soucier des problèmes inter-domaines. JSONP n'utilise pas l'objet XMLHttpRequest. JSONP utilise à la place la balise En raison des politiques inter-domaines, demander des fichiers à un autre domaine peut entraîner des problèmes. Demander un script externe à un autre domaine ne pose pas ce problème. JSONP en profite et demande des fichiers à l'aide de balises de script au lieu d'objets XMLHttpRequest.

Copier après la connexion Fichier du serveur

Un fichier sur le serveur qui enveloppe le résultat dans un appel de fonction :

Copier après la connexion Le résultat renvoie le nom de la paire Un appel à la fonction "myFunc" avec les données JSON en paramètre. Assurez-vous que la fonctionnalité existe sur le client.

Fonction JavaScript

La fonction nommée "myFunc" est située côté client et est prête à traiter les données JSON :

function myFunc(myObj) { document.getElementById("demo").innerHTML = myObj.name; } xmlhttp.send("x=" + dbParam); Copier après la connexion Créer une balise de script dynamique

Selon l'endroit où vous placez la balise de script, l'exemple ci-dessus exécutera la fonction "myFunc" au chargement de la page, qui n'est pas très satisfaisant. La balise de script ne doit être créée qu'en cas de besoin : Créez et insérez la balise lorsque vous cliquez sur le bouton :

function clickButton() { var s = document.createElement("script"); s.src = "demo_jsonp.php"; document.body.appendChild(s); } Copier après la connexion Résultats JSONP dynamiques

L'exemple ci-dessus est encore très statique. Rendez l'exemple dynamique en envoyant JSON à un fichier php et demandez au fichier php de renvoyer un objet JSON basé sur les informations obtenues. Fichier PHP

query("SELECT name FROM ".$obj->$table." LIMIT ".$obj->$limit); $outp = array(); $outp = $result->fetch_all(MYSQLI_ASSOC);echo "myFunc(".json_encode($outp).")"; ?> Copier après la connexion Explication du fichier PHP : Utilisez la fonction PHP json_decode() pour convertir la requête en objet. Accédez à la base de données et remplissez le tableau avec les données demandées. Ajouter un tableau à un objet. Convertissez le tableau en JSON à l'aide de la fonction json_encode(). Enroulez "myFunc()" autour de l'objet de retour

Exemple JavaScript :

Comment faire en sorte que le fichier du serveur appelle la bonne fonction lorsque vous n'avez aucun contrôle sur celui-ci ? Parfois, les fichiers du serveur fournissent des fonctions de rappel comme paramètres : les fichiers php appelleront la fonction que vous transmettez comme paramètres de rappel : Fichiers PHP :

Copier après la connexion javascript:

function clickButton() { var s = document.createElement("script"); s.src = "jsonp_demo_db.php?callback=myDisplayFunction"; document.body.appendChild(s); } Copier après la connexion Plus de programmation liée à connaissances, veuillez visiter : Introduction à la programmation ! !

Php8, je viens aussi

Apprenez la mise en page d'un site Web en 30 minutes

Tutoriel vidéo Shangguan Oracle débutant à compétent

Votre première ligne de code UNI-APP

Flutter de zéro au lancement de l'application

Brother Lian Nouveau didacticiel vidéo Linux

Tutoriel vidéo AXURE 9 (convient à l'interface utilisateur interactive de conception de produits du chef de produit)

Tutoriel vidéo PS Zero Basic Proficiency

Tutoriel vidéo de 16 jours sur l'interface utilisateur pour vous aider à démarrer

Tutoriel vidéo sur les techniques PS et les techniques de découpage

Tutoriel vidéo sur la construction et le lancement de projets d'Alibaba Cloud Environment

Présentation des réseaux informatiques - Connaissances de base que les programmeurs doivent maîtriser

Tutoriel essentiel pour les programmeurs - Explication du protocole HTTP

Tutoriel vidéo Websocket

Explication détaillée de JSON et JSONP dans JS