zoukankan      html  css  js  c++  java
  • angular中的$http配置和参数

    依赖:$httpBackend $cacheFactory $rootScope $q $injector

    使用:$http(config);

    参数

    method:字符串,请求方法。

    url:字符串,请求地址。

    params:字符串或者对象,将使用paramserializer序列化并且作为GET请求的参数。

    data:字符串或者对象,作为请求信息数据的数据。

    headers:对象,字符串或者函数返回表示发送到服务器的HTTP请求头。如果函数的返回值为空,则headers则不发送。函数接受一个配置对象作为参数。

    xsrfHeaderName:字符串,填充XSRF令牌的HTTP请求头名称。

    xsrfCookieName:字符串,含有XSRF令牌cookie的名字。

    transformRequest:函数/函数的数组。转换函数或者一个包含转换函数的数组。转换函数获取http请求体和请求头,并且返回他们的转换版(通常是序列化)。

    transformResponse:函数/函数的数组。转换函数或者一个包含转换函数的数组。转换函数获取http响应体和响应头,并且返回他们的转换版(通常是序列化)。

    paramSerializer:字符串或者返回字符串的函数。用于编写请求参数(指定为对象)的字符串表示形式的函数。如果指令是字符串,那么将被解释为通过$injector注册的函数,这意味着你能通过注册服务方式创建你自己的序列化程序。默认的序列化是$httpParamSerializer;或者你可以使用$httpParamSerializerJQLike。

    cache:boolean,如果为true,一个默认的$http缓存将被作为请求的缓存,否则如果存在一个用$cacheFactory创建的缓存实例,则将用于缓存。

    timeout:数值,毫秒,超时则让请求中止。

    withCredentials:boolean,是否设置withcredentials flag的XHR对象。查看更多信息的凭据。

    responseType:字符串,响应头类型。

    返回

    data:字符串或对象。变换函数变换后的响应体。

    status:数值,响应的http状态码。

    headers:函数,响应头的getter函数。

    config:对象,用于生成请求的配置对象。

    statusText:字符串,响应的HTTP状态文本。

    方法

    get(url,[config]);

    url:请求地址。

    config:请求配置对象。

    delete(url,[donfig]);

    url:请求地址。

    config:请求配置对象。

    head(url,[config]);

    url:请求地址。

    config:请求配置对象。

    jsonp(url,[config]);

    url:请求地址。

    config:请求配置对象。

    post(url,data,[config]);

    url:请求地址。

    data:请求内容。

    config:请求配置对象。

    put(url,data,[config]);

    url:请求地址。

    data:请求内容。

    config:请求配置对象。

    patch(url,data,[config]);

    url:请求地址。

    data:请求内容。

    config:请求配置对象。

    属性

    pendingRequests

    当前正在等待的请求的配置对象数组。主要是为了用于调试目的。

    defaults  

    请求头配置默认属性。

    $httpParamSerializerJQLike

    Http参数序列化程序。序列化程序也将按字母顺序排序的参数。

    使用代码:

    复制代码
    (function () {
        angular.module("Demo", [])
        .controller("testCtrl",["$http", "$httpParamSerializerJQLike",testCtrl]);
        function testCtrl($http, $httpParamSerializerJQLike){
          var data = { id: 1, value: "hello" };//
          $http({
              method: "post",
              data: data,//Form Data = {"id":1,"value":"hello"}
              url: "/url",
              headers: { "Content-Type": "application/x-www-form-urlencoded" }
          }).success(function (d) { console.log(d); }).error(function(error){console.log(error);});
    
          $http({
              method: "post",
              data: $httpParamSerializerJQLike(data),//Form Data 变成 id:1 value:hello url: "/url",
              headers: { "Content-Type": "application/x-www-form-urlencoded" }
          }).success(function(d){ console.log(d);}).error(function(error){ console.log(error);});
        };
    }());
    复制代码

    当然,这种链式写法相比于jq的$ajax有更好的体验。但是,这仍然不是终极版。

    在ES6中,我们有了确定的规则——promise,回调函数。

    so,我们可以:

    var promise = $http({
       //..... 
    });
    
    promise.then().catch();

    OK,就这样。

    最后补充一点,之前我尝试进行代码复用,然后发现很扯淡,$http默认是异步的,那么data就无法取出,除非你的所有数据使用方式是一样的。

    当然也可以搞个函数参数传进去,不过我想如果不是闲的蛋疼就别了。

    --------------------------------------------------------------------------------------2017.4.6 9:57:00-----------------------------------------------------------------

    1。 angular1.6版本之后采用es6的回调写法,使用起来更方便。

    2. 关于$http post参数上传后台接受不到的情况,需要配置config,代码如下:

    .config(['$httpProvider', function($httpProvider) {
            $httpProvider.defaults.headers.post["Content-Type"] = 
                    "application/x-www-form-urlencoded";
            $httpProvider.defaults.
                transformRequest.unshift(function(data,
            headersGetter) {
                var key, result = [];
                    for (key in data) {
                        if (data.hasOwnProperty(key)) {
                            result.push(encodeURIComponent(key) + "="
                            + encodeURIComponent(data[key]));
                        }
                    }
                return result.join("&");
            });
        }])
  • 相关阅读:
    第二章 存储,2.1 永不停止的脚步——数据库优化之路(作者:佳毅)
    第一章 基础设施,1.3 阿里视频云ApsaraVideo是怎样让4000万人同时狂欢的(作者:蔡华)
    第一章 基础设施,1.2 双11背后基础设施软硬结合实践创新(作者:希有)
    第一章 基础设施,1.1 万亿交易量级下的秒级监控(作者:郁松、章邯、程超、癫行)
    阿里巴巴2016双11背后的技术(不一样的技术创新)
    java实现Haffman编码
    CentOS7安装Nginx并部署
    ubuntu usb权限问题解决
    Camera图像处理原理及实例分析-重要图像概念
    sensor的skipping and binning 模式
  • 原文地址:https://www.cnblogs.com/yunzhexiaye/p/6289794.html
Copyright © 2011-2022 走看看