Implementation method of $http in Angularjs passing parameters through message body by post request

  • 2021-07-09 06:48:34
  • OfStack

This article illustrates the way that $http in Angularjs passes parameters through the body of a message with an post request. Share it for your reference, as follows:

In Angularjs, $http passes parameters in the message body as post, and the following modifications are required to ensure the correctness of the parameters passed in the message body.

1. Set up when declaring application:


var httpPost = function($httpProvider) {
  /*******************************************
   Description: $http Adj. post When submitting, correct the message body 
  ********************************************/
  // Use x-www-form-urlencoded Content-Type
  $httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
  /*
   * The workhorse; converts an object to x-www-form-urlencoded serialization.
   * @param {Object} obj
   * @return {String}
   */
  var param = function(obj) {
    var query = '', 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 ? query.substr(0, query.length - 1) : query;
  };
  // Override $http service's default transformRequest
  $httpProvider.defaults.transformRequest = [
    function(data) {
      return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
    }
  ];
};
var ngApp = angular.module('wtApp', ['ngCookies'], httpPost);

2. Call $http post


$http({
  method: 'POST',
  url: 'GetData.ashx',
  params: { id: '1002' },//params As url Parameters of 
  data: { keyName: 'qubernet' }// As a message body parameter 
}, function (data) {
});

I hope this article is helpful to everyone's AngularJS programming.


Related articles: