Maison  >  Article  >  interface Web  >  Méthode pour résoudre le problème selon lequel l'arrière-plan SpringMVC ne peut pas recevoir les valeurs des paramètres après la publication angulaire request_AngularJS

Méthode pour résoudre le problème selon lequel l'arrière-plan SpringMVC ne peut pas recevoir les valeurs des paramètres après la publication angulaire request_AngularJS

WBOY
WBOYoriginal
2016-05-16 15:26:401608parcourir

C'est la méthode utilisée par mon contrôleur SpringMVC en arrière-plan pour recevoir le paramètre isform et saisir simplement sa valeur :

@RequestMapping(method = RequestMethod.POST)
  @ResponseBody
  public Map<String, Object> save(
      @RequestParam(value = "isform", required = false) String isform) {
    System.out.println("isform value: " + isform);
    return null;
 
  }

La première page envoie une demande de publication pour soumettre le formulaire


Il a été constaté que la valeur n'a pas été obtenue en arrière-plan

La première solution à laquelle j'ai pensé plus tard était d'ajouter requestbody aux paramètres de la méthode du contrôleur pour recevoir les paramètres json. Modifiez-le comme suit :
.

@RequestMapping(method = RequestMethod.POST)
  @ResponseBody
  public Map<String, Object> save(
      @RequestParam(value = "isform", required = false) @RequestBody String isform) {
    System.out.println("isform value: " + isform);
    return null;
 
  }

Mais la valeur résultat d'isform est toujours nulle,
Ensuite, j'ai comparé les paramètres de réception des demandes de publication dans des projets précédents, et j'ai trouvé un phénomène intéressant,

Voici les en-têtes de requête par défaut d'Angular :

$httpProvider.defaults.headers.post : (en-tête par défaut pour les requêtes POST)

Type de contenu : application/json

$httpProvider.defaults.headers.put (en-tête par défaut pour les requêtes PUT)

Type de contenu : application/json

Le post et le put d'Angular sont tous deux application/json,

Le "Type de contenu" de la demande de publication de jquery est par défaut "application/x-www-form-urlencoded", j'ai donc modifié le type de contenu par défaut de angulaire,

app.config(function($httpProvider) {
  $httpProvider.defaults.headers.put['Content-Type'] = 'application/x-www-form-urlencoded';
  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
 
});

Le corps de la requête suivante devient comme ceci, mais la valeur de isform n'est toujours pas obtenue plus tard,

Après une longue vérification, a trouvé la raison sur le blog d'un étranger :
Par défaut, jQuery transmet les données en utilisant Content-Type : x-www-form-urlencoded et la sérialisation familière foo=bar&baz=moe AngularJS, cependant, transmet les données en utilisant Content-Type : application/json et {. "foo": "bar", "baz": "moe" } Sérialisation JSON
Traduit par moi-même :

Par défaut, jQuery transmet les données en utilisant Content-Type : x-www-form-urlencoded et une séquence similaire à "foo=bar&baz=moe", cependant AngularJS transmet les données en utilisant Content-Type : application/json et { " foo": "bar", "baz": "moe" } une telle séquence json.

Donc, après avoir défini Content-Type sur x-www-form-urlencodedand, vous devez toujours convertir le format de la séquence,

Voici la solution finale que j'ai moi-même testée après avoir pratiqué avec des étrangers :

app.config(function($httpProvider) {
  $httpProvider.defaults.headers.put['Content-Type'] = 'application/x-www-form-urlencoded';
  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
 
  // Override $http service's default transformRequest
  $httpProvider.defaults.transformRequest = [function(data) {
    /**
     * The workhorse; converts an object to x-www-form-urlencoded serialization.
     * @param {Object} obj
     * @return {String}
     */
    var param = function(obj) {
      var query = '';
      var name, value, fullSubName, subName, subValue, innerObj, i;
 
      for (name in obj) {
        value = obj[name];
 
        if (value instanceof Array) {
          for (i = 0; i < value.length; ++i) {
            subValue = value[i];
            fullSubName = name + '[' + i + ']';
            innerObj = {};
            innerObj[fullSubName] = subValue;
            query += param(innerObj) + '&';
          }
        } else if (value instanceof Object) {
          for (subName in value) {
            subValue = value[subName];
            fullSubName = name + '[' + subName + ']';
            innerObj = {};
            innerObj[fullSubName] = subValue;
            query += param(innerObj) + '&';
          }
        } else if (value !== undefined && value !== null) {
          query += encodeURIComponent(name) + '='
              + encodeURIComponent(value) + '&';
        }
      }
 
      return query.length &#63; query.substr(0, query.length - 1) : query;
    };
 
    return angular.isObject(data) && String(data) !== '[object File]'
        &#63; param(data)
        : data;
  }];
});

Ajoutez le code ci-dessus dans le module angulaire et voyons l'effet :


J'ai trouvé que le style de demande de publication est cohérent avec le style de demande de publication de jquery. Est-ce vrai ? ! !

Regardez l'état de réception des paramètres en arrière-plan,

isform peut désormais recevoir les paramètres normalement, et le tour est joué !

Ce qui précède est la solution pour que les paramètres de réception en arrière-plan de la demande de publication d'Angular soient nuls. J'espère que cela sera utile à l'apprentissage de chacun.

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