Maison > interface Web > js tutoriel > Analyse approfondie du protocole jsonpprincipe_json

Analyse approfondie du protocole jsonpprincipe_json

WBOY
Libérer: 2016-05-16 15:38:02
original
1985 Les gens l'ont consulté

Aujourd'hui, dans le processus de développement du débogage commun, nous devons obtenir des données sur tous les domaines. Parce que jquery est utilisé, bien sûr, l'utilisation de dataType:'jsonp' peut facilement résoudre le problème.
Mais comme le backend ne prenait pas en charge l'accès jsonp à l'époque, il m'a demandé plus tard lors de l'implémentation de cette fonction, quel est le format renvoyé au format jsonp ? Je savais seulement comment l'utiliser, mais je n'arrivais pas à trouver la réponse. . .

Bien que cela ait été résolu plus tard, moi qui aime résoudre les problèmes, j'ai toujours été inquiet à ce sujet. Je dois faire des recherches approfondies, alors j'ai commencé à lire les informations, et j'ai ressenti une illumination soudaine après l'avoir vue, alors j'ai commencé à lire les informations. prévu de le faire Notes à partager avec tout le monde.

La différence entre JSON et JSONP

Bien qu'il n'y ait qu'une seule lettre de différence entre JSON et JSONP, ce n'est en réalité pas du tout la même chose : JSON est un format d'échange de données et JSONP est un protocole d'interaction de données inter-domaines. Ce que vous obtenez en utilisant la méthode JSONP. est toujours Ce sont des données au format json.

Pour parler franchement, 用JSON来传数据,靠JSONP来跨域.

JSONP expliqué en détail

Nous le savons tous, 一个页面的ajax只能获取和此页面同域的数据。, donc lorsque nous avons besoin d'obtenir des données sur plusieurs domaines, nous devons utiliser la méthode JSONP pour les obtenir.

Comme le montre la figure ci-dessous, il s'agit du message d'erreur renvoyé en utilisant le format json pour obtenir des données inter-domaines :

Alors comment le résoudre ? Les chaussures pour enfants front-end qui utilisent des frameworks peuvent avoir leurs propres méthodes correspondantes, par exemple, jquery peut le résoudre en ajoutant simplement dataType设为jsonp, mais lorsque nous l'utilisons, avons-nous déjà réfléchi à la raison pour laquelle cela peut être résolu de cette façon ? Quelle est l’idée centrale ?

Ce qui suit est une explication détaillée pour vous. La première idée est d'utiliser des balises scirpt pour introduire des données inter-domaines. Entrons lentement dans le processus de jsonp depuis le début.

Guide Étape 1

Écrireb.com/b.js Contenu :

Copier le code Le code est le suivant :
alert('hello');

Puis écrivez a.com/a.html le contenu :

Copier le code Le code est le suivant :
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal