AngularJS Resource:与 RESTful API 交互

REST(表征性状态传输,Representational State Transfer)是Roy Fielding博士在2000年他的博士论文中提出来的一种软件架构风格。RESTful风格的设计不仅具有更好的可读性(Human Readable),而且易于做缓存以及服务器扩展(scalability)。REST风格体现在URL设计上:

  • 每个URL对应一个资源
  • 对资源的不同操作对应于HTTP的不同方法
  • 资源表现形式(representation)通过AcceptContent-Type指定

AngularJS提供了$resourceService来更方便地与RESTful服务器API进行交互,可以方便地定义一个REST资源,而不必手动所有的声明CRUD方法。

参考文档: https://docs.angularjs.org/api/ngResource/service/$resource

Resource Factory

$resourceService定义在ngResourceModule中,需要在你的HTML中引入这个Module对应的JS,同时在你的APP中添加这样一个依赖:

var app = angular.module(‘helloApp, [‘ngResource‘]);

然后为资源建立一个Factory:

app.factory(‘Notes‘, [‘$resource‘, function($resource) {
    return $resource(‘/notes/:id‘);
}]);

当然,你也可以不把$esource的实例放到Factory里,直接在控制器中存起来:var Notes = $resource(‘/notes/:id)

CRUD

在你的控制器中就可以对资源进行增删改查了:

app.controller(‘NotesCtrl‘, [‘$scope‘, ‘Notes‘, function($scope, Notes) {
    var notes = Notes.query(function(){
        // GET: /notes
        // Response: [{id: 1, content: ‘hello‘}, {id: 2, content: ‘world‘}];

        var first = notes[0];
        first.content = ‘halo‘;
        first.$save();
        // POST: /notes/1 {id: 1, content: ‘halo‘}
        // Response: {id: 1, content: ‘halo‘}

        second.$delete();
        // DELETE: /notes/2
    });

    var note = new Notes({content: ‘xxx‘});
    note.$save();
    // POST: /notes
    // Response: {id: 3, content: ‘xxx‘}
}]);

PUT 操作

$resource提供了五种默认操作:getquerysaveremovedelete。你可以配置一个update操作来完成HTTP PUT:

app.factory(‘Notes‘, [‘$resource‘, function($resource) {
    return $resource(‘/notes/:id‘, null, {
        update: { method:‘PUT‘ }
    });
}]);

现在,你可以在控制器中获取一个note并更新它:

var note = Notes.get({ id: 3}),
    $id = note.id;

note.content = ‘yyy‘;
Notes.update({ id:$id }, note);
// PUT /notes/3 {id: 3, content: ‘yyy‘}

现在你的Notes有六种操作了。这些操作有两种调用方式:

  1. 通过资源类调用,例如:Notes.update({id: xxx})
  2. 通过资源实例调用,例如:note.$update(),此时操作名需加前缀$

具体的调用参数可参考文档:

HTTP GET “class” actions: Resource.action([parameters], [success], [error])

non-GET “class” actions: Resource.action([parameters], postData, [success], [error])

non-GET instance actions: instance.$action([parameters], [success], [error])

其中,success参数为(value, responseHeaders),error参数为(httpResponse)

属性/URL映射

上述例子中,我们看到note对象的id属性会映射到URL中的:id/notes/:id)。如果你的业务更加复杂,可以手动配置这个映射关系。例如:

var Notes = $resouce(‘/users/:userId/notes/:noteId‘, {
    noteId: ‘@id‘,
    userId: ‘@owner‘
}

将会读取noteownerid属性来生成URL,比如删除note时:

// note === {id: 123, owner: ‘alice‘, content: ‘hello‘}
note.$delete();
// DELETE: /users/alice/notes/123

在构造$resource时,多于的属性映射会成为URL Query。例如:

var Notes = $resouce(‘/notes/:id‘, {
    id: ‘@id‘,
    user: ‘@owner‘
});
// note === {id: 123, owner: ‘alice‘, content: ‘hello‘}
note.$delete();
// DELETE: /notes/123?user=alice

REST操作的声明和调用中,多于的属性会成为URL Query。例如:

var Notes = $resouce(‘/notes/:id‘, {id: ‘@id‘}, {
    update: {method: ‘PUT‘, operator: ‘bob‘}
});
// note === {id: 123, content: ‘hello‘}
note.$update({trusted: true});
// PUT: /notes/123?operator=bob&trusted=true {id: 123, content: ‘hello‘}

响应转换

有时基于既定的后台设计,无法提供完全RESTful的API,比如/notes返回的是一个分页器对象,而非数组。此时,我们仍然可以使用$resource,但需要设置响应转换回调。例如:

var Notes = $resouce(‘/notes/:id‘, null, {
    pager: {
        method: ‘GET‘,
        transformResponse: function(data, headers){
            // Server respond:
            // data = {currentPage: 1,
            //     totalPage: 20,
            //     pageSize: 2,
            //     content: [{id: 1, content: ‘hello‘}, {id: 2, content: ‘world‘}]}
            var pager = JSON.parse(data);
            return pager.content;
        }
    }
});
var notes = Notes.query(function(){
    // GET: /notes
    // notes === [{id: 1, content: ‘hello‘}, {id: 2, content: ‘world‘}]
});

类似响应重写,你还可以设置请求转换transformRequest

虽然$resource的设计可以支持绝大多数的URL和内容表示设计,但如果你发现$resource的使用过程极其复杂,那可能是你的服务器API并不满足RESTful风格。

转 http://harttle.com/2015/06/05/angular-resource.html

时间: 2024-08-07 04:15:26

AngularJS Resource:与 RESTful API 交互的相关文章

黄聪:AngularJS中的$resource使用与Restful资源交互(转)

原文:http://blog.csdn.net/he90227/article/details/50525836 1.AngularJS中的 $resource 这个服务可以创建一个资源对象,我们可以用它非常方便地同支持RESTful的服务端数据源进行交互,当同支持RESTful的数据模型一起工作时,它就派上用场了.      REST是Representational State Transfer(表征状态转移)的缩写,是服务器用来智能化地提供数据服务的一种方式 1)我们首先需要引入ng-Re

angularjs $resource restful api

AngularJS中的RESTful资源 palwo 发表于 2014-12-16 17:31:50 $http服务提供了一个非常低级的实现,可以用来发送XHR请求,同时它还为你提供了很大的可控性和灵活性.但是,在大多数情况下,我们需要处理对象,以及封装了特定属性和方法的对象模型,例如一个person对象(带有详细信息),或者一个信用卡对象. 在这些情况下,如果我们能够创建一个JS对象,而且它可以理解并代表这种对象模型,是不是会很棒?如果我们仅仅编辑这个对象的属性,例如保存或者更新,那么这些状态

RESTful API Design With NodeJS & Restify

http://code.tutsplus.com/tutorials/restful-api-design-with-nodejs-restify--cms-22637 The RESTful API consists of two main concepts: Resource, and Representation. Resource can be any object associated with data, or identified with a URI (more than one

RESTful API的设计原则

最近一直在做公司的一个API平台的项目,前后大约有半年多了,中间穿插了好多其他的项目一起做的.上周经理要求写文档,我就重新打开项目开始检阅之前的代码,发现好多地方当初设计的并不合理,忽然就想到,一个好的API平台,应该怎么来设计呢?有哪些规范要遵守呢?面对自己的项目,感觉好多地方都要改,但是已经有人在用了,怎么办?全都要改动吗?所以就上网找解决方案,然后就发现一精品贴,现转载过来,以备不时查阅. 原文地址:http://www.cnblogs.com/moonz-wu/p/4211626.htm

HTTP methods 与 RESTful API

目录: RESTful 是什么 JSON-server (提供 RESTful API 接口 + JSON 返回数据) 如何选择 REST 方法 HTTP verbs / method (安全 | 幂等) HTTP POST V.S. PUT REST POST | PUT | PATCH RESTful 是什么 阮一峰:理解RESTful架构 Representational State Transfer 表征状态转移 核心:resource.representation 指的是 resour

微服务架构实战:Swagger规范RESTful API

转载本文需注明出处:EAII企业架构创新研究院,违者必究.如需加入微信群参与微课堂.架构设计与讨论直播请直接回复公众号:"EAII企业架构创新研究院".(微信号:eaworld)   导读:本文是EAII微服务系列文章之一.随着微服务架构的流行,REST风格也是大势所趋.那么,什么是REST?如何规范我们的RESTFUL API 文档?本文中,作者主要基于以上两个话题进行讨论并探讨在数字化企业云平台实践中如何规范RESTful文档. REST的引入 随着微服务架构的广泛流行,REST风

好RESTful API的设计原则

说在前面,这篇文章是无意中发现的,因为感觉写的很好,所以翻译了一下.由于英文水平有限,难免有出错的地方,请看官理解一下.翻译和校正文章花了我大约2周的业余时间,如有人愿意转载请注明出处,谢谢^_^ Principles of good RESTful API Design 好RESTful API的设计原则 Good API design is hard! An API represents a contract between you and those who Consume your da

RESTful API 编写指南

基于一些不错的RESTful开发组件,可以快速的开发出不错的RESTful API,但如果不了解开发规范的.健壮的RESTful API的基本面,即便优秀的RESTful开发组件摆在面前,也无法很好的理解和使用.下文Gevin结合自己的实践经验,整理了从零开始开发RESTful API的核心要点,完善的RESTful开发组件基本都会包含全部或大部分要点,对于支持不够到位的要点,我们也可以自己写代码实现. 1. Request 和 Response RESTful API的开发和使用,无非是客户端

RESTful API的十个最佳实践

WebAPI在过去几年里非常的盛行,我们很多以往的技术手段都慢慢的转换为使用WebAPI来开发,因为它的语法简单规范化,以及轻量级等特点,这种方式收到了广泛的推崇. 通常我们使用RESTFul(Representational State Transfer)的设计方式来设计Web api,这通常用来分离API结构了业务逻辑,它使用典型的HTTP方法,诸如GET,POST.DELETE,PUT来和资源进行交互. 以下是设计RESTful API的是个最佳实践: 1. 使用名词而不是动词 为了易于理