Heim  >  Artikel  >  Web-Frontend  >  Methode zur Lösung des Problems, dass der SpringMVC-Hintergrund nach dem Angular Post request_AngularJS keine Parameterwerte empfangen kann

Methode zur Lösung des Problems, dass der SpringMVC-Hintergrund nach dem Angular Post request_AngularJS keine Parameterwerte empfangen kann

WBOY
WBOYOriginal
2016-05-16 15:26:401608Durchsuche

Dies ist die Methode für meinen Hintergrund-SpringMVC-Controller, um den isform-Parameter zu empfangen und einfach seinen Wert einzugeben:

@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;
 
  }

Auf der Startseite wird eine Post-Anfrage zum Absenden des Formulars gesendet


Es wurde festgestellt, dass der Wert nicht im Hintergrund ermittelt wurde

Die erste Lösung, die mir später einfiel, bestand darin, requestbody zu den Controller-Methodenparametern hinzuzufügen, um die JSON-Parameter zu erhalten:

@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;
 
  }

Aber das Wertergebnis von isform ist immer noch null,
Dann habe ich die Parameter für den Empfang von Post-Anfragen in früheren Projekten verglichen und ein interessantes Phänomen festgestellt:

Das Folgende sind die Standard-Anfrageheader von Angular:

$httpProvider.defaults.headers.post: (Header-Standardeinstellungen für POST-Anfragen)

Inhaltstyp: application/json

$httpProvider.defaults.headers.put(Header-Standardwerte für PUT-Anfragen)

Inhaltstyp: application/json

Angulars Post und Put sind beide application/json,

Der „Content-Type“ der Post-Anfrage von jquery ist standardmäßig „application/x-www-form-urlencoded“, daher habe ich den Standard-Content-Type in „angular“ geändert,

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';
 
});

Der nächste Anforderungstext sieht so aus, aber der Wert von isform wird später immer noch nicht erhalten,

Nach langer Suche fand ich den Grund auf dem Blog eines Ausländers:
Standardmäßig überträgt jQuery Daten mit Content-Type: x-www-form-urlencoded und der bekannten foo=bar&baz=moe-Serialisierung, überträgt Daten jedoch mit Content-Type: application/json und {. „foo“: „bar“, „baz“: „moe“ } JSON-Serialisierung
Von mir selbst übersetzt:

Standardmäßig überträgt jQuery Daten mit Content-Type: x-www-form-urlencoded und einer Sequenz ähnlich „foo=bar&baz=moe“, AngularJS überträgt Daten jedoch mit Content-Type: application/json und { " foo": "bar", "baz": "moe" } eine solche JSON-Sequenz.

Nachdem Sie Content-Type auf x-www-form-urlencodedand gesetzt haben, müssen Sie noch das Format der Sequenz konvertieren,

Das Folgende ist die endgültige Lösung, die ich selbst getestet habe, nachdem ich mit Ausländern geübt habe:

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;
  }];
});

Fügen Sie den obigen Code im Winkelmodul hinzu und sehen Sie sich den Effekt an:


Ich habe festgestellt, dass der Post-Request-Stil mit dem Post-Request-Stil von jquery übereinstimmt. Stimmt das? ! !

Sehen Sie sich den Parameter-Empfangsstatus im Hintergrund an,

isform kann jetzt normal Parameter empfangen und fertig!

Das Obige ist die Lösung dafür, dass die Post-Request-Hintergrundempfangsparameter von Angular null sind. Ich hoffe, es wird für das Lernen aller hilfreich sein.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn