angular 的 GET 请求 和 POST 请求的 区别 及 实现

1.GET 请求

.factory('AlarmService', ['$rootScope','ENV','$resource','$http','ionicToast',function($rootScope,ENV,$resource,$http,ionicToast) {
  var resource = $resource(ENV.baseUrl + ENV.alarm);
  return{
    getAlarmListData: function(){
      // 参数
      var params = {
        userAccount: window.localStorage.userAccount,
        pageNo: 1
      }
      /**
       * GET 请求方式
       * 1.jquery
       * 2.$http
       * 3.$resource.save()
       */
      // 1.jquery
      $.ajax({
        url: ENV.baseUrl + ENV.alarm,
        type: 'GET',
        data: params,
        dataType : 'json',
        success:function(data){
          // 成功的回调
          $rootScope.$broadcast("alarmListData.updated",data.object);
        },
        error:function(xhr){
          // 失败的回调
          ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
        }
      });

      // 2.$http
      $http({
        url : ENV.baseUrl + ENV.alarm,
        method : 'GET',
        params: params,
        dataType : 'json'
      }).success(function(data, status, headers, config) {
        // 成功的回调
        $rootScope.$broadcast("alarmListData.updated",data.object);
      }).error(function(data, status, headers, config) {
        // 失败的回调
        ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
      });

      $http.get(ENV.baseUrl + ENV.alarm,{
        params: params
      }).success(function(data, status, headers, config) {
        // 成功的回调
        $rootScope.$broadcast("alarmListData.updated",data.object);
      }).error(function(data, status, headers, config) {
        // 失败的回调
        ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
      });

      // 3.$resource.get()
      resource.get(params, function(data){
        if(!data.object){
          ionicToast.show('暂无数据!', 'top', false, 1000);
        }else{
          $rootScope.$broadcast("alarmListData.updated",data.object);
        }
      },function(){
        ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
      })
    }
  }
}])

2.POST 请求

.factory('AlarmService', ['$rootScope','ENV','$resource','$http','ionicToast',function($rootScope,ENV,$resource,$http,ionicToast) {
  var resource = $resource(ENV.baseUrl + ENV.alarm);
  return{
    getAlarmListData: function(){
      // 参数
      var params = {
        userAccount: window.localStorage.userAccount,
        pageNo: 1
      }
      /**
       * POST 请求方式
       * 1.jquery
       * 2.$http
       * 3.$resource.save()
       */

      // 1.jquery
      $.ajax({
        url: ENV.baseUrl + ENV.alarm,
        type: 'POST',
        data: params,
        dataType : 'json',
        success:function(data){
          // 成功的回调
          $rootScope.$broadcast("alarmListData.updated",data.object);
        },
        error:function(xhr){
          // 失败的回调
          ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
        }
      });

      // 2.$http
      $http({
        url : ENV.baseUrl + ENV.alarm,
        method : 'POST',
        data: params,
        dataType : 'json',
        headers:{'Content-Type': 'application/x-www-form-urlencoded'}
      }).success(function(data, status, headers, config) {
        // 成功的回调
        $rootScope.$broadcast("alarmListData.updated",data.object);
      }).error(function(data, status, headers, config) {
        // 失败的回调
        ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
      });

      $http.post(
        ENV.baseUrl + ENV.alarm,
        params,
        { // 将参数传递的方式改成form
          headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
          transformRequest: function (data) {
            return $.param(data);
          }
        }
      )
      .success(function(data, status, headers, config) {
        // 成功的回调
        $rootScope.$broadcast("alarmListData.updated",data.object);
      })
      .error(function(data, status, headers, config) {
        // 失败的回调
        ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
      });

      // 3.$resource.save()
      resource.save(params,function(data){
        if(!data.object){
          ionicToast.show('暂无数据!', 'top', false, 1000);
        }else{
          $rootScope.$broadcast("alarmListData.updated",data.object);
        }
      },function(){
        ionicToast.show('网络异常,请检查网络!', 'top', false, 1000);
      })
    }
  }
}])

注:post 请求需要 在 app.js 中 config 里配置 headers

$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';

原文地址:https://www.cnblogs.com/crazycode2/p/9114842.html