[转载]angular通过$http与服务器通信

转载自:http://www.cooklife.cn/detail/54c5044ec93620284e964b58#View

转载自:http://www.cooklife.cn/detail/54c5044ec93620284e964b58#View

转载自:http://www.cooklife.cn/detail/54c5044ec93620284e964b58#View

重要事情说三遍,尊重原作者,转账仅作笔记需要方便查阅。

angular是一个前端框架,实现了可交互式的页面,但是对于一个web应用,页面上进行展示的数据从哪里来,肯定需要服务端进行支持,那么angular是如何同服务端进行交互的呢?

$http

angular提供了$http服务来同服务端进行通信,$http服务队浏览器的XMLHttpRequest对象进行了封装,让我们可以以ajax的方式来从服务器请求数据。

$http服务是一个接受一个参数的函数,参数的类型是对象,用来配置生成的http的请求,该函数返回一个promise对象(关于promise规范,可以看看这篇文章

var promise = $http({
  method:‘GET‘,
  url:‘/api/user.json‘
});

promise.then(function(resp){}, function(resp){})

$http请求的配置对象

$http()接受的配置对象可以包含以下属性:

method:http请求方式,可以为GET,DELETE,HEAD,JSONP,POST,PUT

url:字符串,请求的目标

params:字符串或者对象,会被转换成为查询字符串追加的url后面

data:在发送post请求时使用,作为消息体发送到服务器

headers:一个列表,每个元素都是一个函数,返回http头

xsrfHeaderName(字符串):保存XSFR令牌的http头的名称

xsrfCookieName:保存XSFR令牌的cookie名称

transformRequest:函数或者函数数组,用来对http请求的请求体和头信息进行转换,并返回转换后的结果。

transformResponse:函数或者函数数组,用来对http响应的响应体和头信息进行转换,并返回转换后的结果。

cache:布尔类型或者缓存对象,设置之后angular会缓存get请求。

timeout:数值,延迟请求

responseType:字符串,响应类型。可以为arraybuffer, blob,document,json, text, moz-blob, moz-chunked-text, moz-chunked-arraybuffer

$http请求的响应对象

angular传递给then方法的响应对象包括以下几个属性

data:转换之后的响应体

status:http响应状态码

headers:头信息

config:生成原始请求的设置对象

statusText:http响应状态的文本

拦截器

angular中通过拦截器我们可以从全局层面对请求以及响应进行拦截。

使用拦截器之前,我们通过factory()声明一个服务,然后通过$httpProvider注册拦截器。拦截器分为四种,两种成功拦截器,两种失败拦截器。

angular.module(‘test‘, []).factory(‘testInterceptor‘, function($q){
 var interceptor = {
  ‘request‘:function(config){
    return config;
  },
  ‘response‘:function(resp){
    return response;
  },
  ‘requestError‘:function(rejection){
    return $q.reject(rejection);
  },
  ‘responseError‘:function(rejection){
    return rejection
  }
 }
 return interceptor;
})

angular.module(‘test‘, []).config(function($httpProvider){
 $httpProvider.interceptors.push(‘testInterceptor‘);
})
时间: 2024-10-27 11:00:16

[转载]angular通过$http与服务器通信的相关文章

【转】angular通过$http与服务器通信

http://www.cooklife.cn/detail/54c5044ec93620284e964b58#View angular是一个前端框架,实现了可交互式的页面,但是对于一个web应用,页面上进行展示的数据从哪里来,肯定需要服务端进行支持,那么angular是如何同服务端进行交互的呢? $http angular提供了$http服务来同服务端进行通信,$http服务队浏览器的XMLHttpRequest对象进行了封装,让我们可以以ajax的方式来从服务器请求数据. $http服务是一个

【转载】浏览器与服务器通信的过程

首先当用户在浏览器的地址栏中敲入了网站的网址 ( 比如: alibaba.com ) ,这时浏览器会首先通过访问的域名来定位到IP (DNS) 从而找到去哪里获取资源, 这时, 浏览器会依次进行如下查找: 1. 浏览器缓存 : 浏览器首先会在自己的缓存中查找有没有对应的域名 – IP匹配, 如果好运的话, 这里就可以直接尝试去访问资源了, 如果运气平平则往下走吧. 2. 系统缓存 : 浏览器缓存中没有命中, 浏览器会告诉操作系统:”嘿, 我在我自己口袋里没找到, 可能丢了, 我得去你那看看”,

ios Communicating with HTTP Servers 与HTTP服务器通信 官方文档翻译(五)

原文地址:developer 时间过的很快,一眨眼周末就过了.人的一生到底怎么样才能过的有意义呢?我一直在找答案.做自己喜欢的事情,爱自己喜欢的人,或是成就一番伟业.都是不错的选择,找到自己想要做的事情,不要放弃寻找.最终生命带走的只能是珍贵的回忆,晚上快乐. 与HTTP服务器通信 本章解释了如何创建.发送和接收HTTP请求和响应. 创建一个CFHTTP请求 组成一个HTTP请求消息的远程服务器执行的方法,对象操作(URL),消息头和消息体.方法通常是下列之一:GET, HEAD, PUT, P

iOS Communicating with Authenticating HTTP Servers 与HTTP服务器通信认证 官方文档翻译(六)

原文地址:developer 召集翻译人手:请加入486111671  ios 官方文档翻译                                                            与HTTP服务器通信认证 本章描述了如何与HTTP服务器身份验证利用CFHTTPAuthentication API.它解释了如何找到匹配验证对象和凭证,将它们应用到一个HTTP请求,并将它们存储供以后使用. 一般来说,如果一个HTTP服务器将返回一个401或407响应后你的HTTP请求

利用webSocket使网页和服务器通信

WebSocket protocol 是HTML5一种新的协议.它实现了浏览器与服务器全双工通信(full-duplex).具体说明请查阅相关资料,下面我来演示一种简单的页面与服务器通信的简单样例. 新建个web工程(基于tomcat-7版本(6以下的版本未实现webSocket功能)) 引入tomcat/lib目录下的tomcat7-websocket.jar和websocket-api.jar添加到classpath中 新建WebSocketConfig.java如下 本次采用注解方式 im

与HTTP服务器通信(Communicating with HTTP Servers)

本文解释了如何创建.发送和接收HTTP请求和响应. 创建一个CFHTTP请求 HTTP请求是一个消息,这个消息由远程服务器执行的方法,操作的对象(URL),消息头和消息体.方法通常是下面之一:GET, HEAD, PUT, POST, DELETE, TRACE, CONNECT 或OPTIONS.用CFHTTP创建一个HTTP请求分为四个步骤: 使用CFHTTPMessageCreateRequest 函数生成CFHTTP消息对象 使用CFHTTPMessageSetBody函数设置消息体 使

使用Ajax与服务器通信,达到异步通信效果

AJAX = 异步 JavaScript 和 XML,AJAX 是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新.传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面. XMLHttpRequest 对象 所有现代浏览器均支持 XMLHttpRequest 对象(IE5 和 IE6 使用 ActiveXObject),XMLHttpRequest 用于在后台与服务

AFNetworking+Nginx+HTTPS服务器通信

摘要 1.介绍iOS平台用AFNetworking与HTTPS后台接口进行安全通信. 2.介绍后台自签名证书制作步骤. 3.以及Linux平台Nginx配置HTTPS协议接口的Web站点. iOS AFNetworking HTTPS Openssl Nginx 这个关于AFNetworking的HTTPS安全通信的问题,很多没有过第一次经验的以及甚至有过一次经验的都会有点不确定. 其实很简单: A.对于后台服务器所配置动证书如果是经过CA机构认证颁发的,那么用户用AFNetworking来访问

BS网站在线升级(服务器通信)

背景:日前公司需要将客户企业站增加在线升级功能.即客户登录自身网站管理后台后台,发生请求到我公司门户网站,如果存在新版本则提示用户更新.客户从我们公司买到的空间.数据库.和网站代码后可以直接根据智能提示完成webconfig配置,后期客户可以从我们手中购买网站模版实现个性化风格主题的网站设置.我们所有客户的网站结构是一模一样的.因为前台客户浏览的页面均为代码自动生成的静态页,所以更新过程不影响访客浏览. 分析:BS架构项目不同与CS架构——通过请求检测版本更新后返回更新包,根据本地安装目录即可完