Maison  >  Article  >  interface Web  >  Explication détaillée des appels inter-domaines Ajax liés à JAVA background_AJAX

Explication détaillée des appels inter-domaines Ajax liés à JAVA background_AJAX

微波
微波original
2017-06-28 13:56:131005parcourir

Cet article présente principalement l'explication détaillée de l'appel multi-domaines Ajax (jsonp) du backend JAVA. L'éditeur pense que c'est assez bon. Maintenant, je vais le partager avec vous et le donner comme référence. Suivons l'éditeur pour jeter un œil

1 Définition JSONP

JSONP est l'abréviation de l'anglais JSON avec Padding, qui est un accord non officiel. Il permet de générer des balises de script côté serveur et de les renvoyer au client, permettant ainsi l'accès au site sous forme de rappel javascript. JSONP est une injection de balise de script qui ajoute la réponse renvoyée par le serveur à la page pour implémenter des fonctions spécifiques.

2. Origine de JSONP

Pour expliquer l'origine de JSONP, parlons d'abord du « SOP : Same Origin Policy » du navigateur. En bref, le navigateur restreint les programmes de script à interagir uniquement avec les scripts du même protocole, du même nom de domaine et du même port. Cela inclut le partage et la transmission de variables, etc. La livraison de cookies suit également la même politique. Cela provoque quelques problèmes lors de l'intégration d'applications impliquant plusieurs serveurs. Le problème de l'accès inter-domaines empêche le code Ajax du site A d'accéder aux données du site B.

Comment résoudre l'accès inter-domaines ? Ensuite, vous devez profiter d'une fonctionnalité du navigateur : bien que le navigateur n'autorise pas les scripts de la page à lire les données entre domaines, il permet au HTML de référencer des ressources inter-domaines, telles que des images, du CSS et des scripts. La référence au programme de script est spéciale. Une fois analysée par le navigateur, elle est identique au programme de script local et peut être interprétée et exécutée immédiatement. Par exemple, dans un fichier js sur le site B, une simple boîte de dialogue : alert ("This is Victor!");. Si vous référencez ce js sur le site A, ce script sera exécuté dans l'application sur le site B et affichera un message d'alerte. Étant donné que la référence aux scripts hors site est implémentée via des balises de script et que le programme de script peut contrôler toutes les balises de la page HTML via DOM (y compris la création dynamique de balises de script), cela peut être réalisé en appelant des programmes hors site. aux ressources locales. De plus, grâce à l'utilisation de la balise 3f1c4e4b6b16bbbd69b2ee476dc4f83a, des appels de fonctions JavaScript exécutables ou des données JSON peuvent être renvoyés directement depuis le serveur.

3. Principe et mise en œuvre de JSONP

Enregistrez d'abord un rappel sur le client, puis transmettez le nom du rappel au serveur. À ce stade, le serveur génère d'abord des données JSON. Utilisez ensuite la syntaxe JavaScript pour générer une fonction. Le nom de la fonction est le paramètre jsonp passé

Ensuite, les données JSON sont directement placées dans la fonction en tant que paramètre, générant ainsi une syntaxe js. le client.

Enfin, la balise de script est analysée dans le navigateur client et le document JavaScript renvoyé est exécuté. À ce moment, les données sont transmises en tant que paramètre à la fonction de rappel prédéfinie du client (dynamiquement). exécuter la fonction de rappel).

Opérations de code spécifiques :

1, code js

$.ajax({

  url: 'http://192.168.3.49:8080/PORTAL/authCode',

  type: 'post',

  dataType:'jsonp',

  jsonp: "callback",

  data: {

    "type":'0',

    "mobilePhone": $("#tel").val()

  },

  success:function(data){

    alert(data.ret)

    settime(obj);

  },

  error:function(data){

    $('#mstr_ck').html("获取验证码失败,请重试!");

    $("#error_ck").show();

  }

});

2, code java

@RequestMapping(value = "authCode")

@ResponseBody

public String getMobileAuthCode( HttpServletRequest request, String callback)

    throws Exception {

  String result = "{'ret':'true'}";

  //加上返回参数

  result=callback+"("+result+")";

  return result;

}

Comme ci-dessus : l'appel front-end le résultat apparaît : alerte ("vrai") 

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