Avec le développement rapide du front-end, l'application de la technologie jsonp est devenue de moins en moins au cours des dernières années, mais nous devons encore comprendre jsonp en détail, ce qui est d'une grande importance pour la façon dont nous coopérons avec le back-end.
jsonp
Comme nous le savons tous, jsonp est un moyen d'obtenir des données sur plusieurs domaines. Quant à savoir pourquoi il existe des domaines croisés et pourquoi des domaines croisés, je ne donnerai pas d'explication détaillée ici.
Ne dis pas de bêtises, va directement au
code
function backFn(data) {
console.log(data)
}
<script src="httpsL//wwww.接口地址.com/?参数&callback=backFn"></script>
Code derrière
这里用node为例子
服务器名称.get('/接口地址',(request,response) => {
fs.readFile('数据地址',(error,data) => {
let resData = `backFn(${
JSON.parse(data.toString())})`
response.send(resData)
console.log('请求已响应')
})
})
Vous ne vous sentez pas si confus? N'aie pas peur, analysons-le petit à petit
- Le principe de jsonp est de créer dynamiquement une balise de script et de demander des données en écrivant l'adresse d'interface sur l'attribut src
- L'adresse d'interface demandée doit être suivie d'un callback = backFN
- BackFn est une fonction que vous avez écrite au premier plan. Cette fonction est utilisée pour recevoir les paramètres renvoyés par la requête. Ce paramètre doit être négocié avec l'arrière-plan
- Le rappel doit également être négocié avec l'arrière-plan, qui est comme un signal
- Le format de données renvoyé par l'arrière-plan doit être le format backFn (données incluses)
Il y a des exigences strictes sur le format des données renvoyées par le backend.
Regardez de plus près et voyez si vous êtes familier avec backFn (). Cela équivaut à exécuter directement la fonction backFn que nous avons écrite à la réception et traiter les données
comme Passé en paramètre
C'est le principe de jsonp, cela semble-t-il clair?