AngularJS+Node的RESTful之基本实现
欢迎大家指导与讨论 : )
一、前言
本文主要讲述RESTful在node端与AngularJS两端配合的基本实现方法,为了尽量做到大家易看易懂,因此文章也没有深入探讨(其实是小鹏我只学到目前这些 - -),只是谈到增删查改的RESTFUL基本实现和相关知识点。如果文章中有什么错误或者不足,希望大家能够指出,共同进步。O(∩_∩)O
二、RESTful
二 . 1 概念
那究竟什么是RESTful?它和传统的$http(Ajax)的传输方式有什么不同?以小鹏的愚见,我认为就是传输动作的"主语"有所不同而已。在传统的传输方式中,工具($http、Ajax)是传输动作的执行者:" hey!哥们($http)!你那么有空,能不能帮我从对面楼的七楼(指定Url)拿(method: get)个快递(expressage)?"上面这句话用代码来"翻译"便是 $http({method:'GET', url:'http://localhost/seven'})... 让我们以语文的角度来分析这段代码。主语是$http工具(功能的具体执行者),动作是GET,宾语是url里面指定的资源(也就是GET这个动作的接受者)。如果是以RESTful风格的传输动作呢?那么上面的这段代码会变成 var expressage = $resource('http://localhost/seven') (为资源指定url) expressage.query(function(){//callback}) 可以明显的看出,代码中的主语变成了"快递expressage"(资源本身),动词是query(相当于GET)。上面两种不同风格的代码有一样的效果,但是RESTful呢,是把动作的执行者变成了资源本身,以资源的角度执行不同的动作。资源!资源!资源!
二 . 2 动作类型
以上面为例,具体动作有:expressage.query(资源查询),expressage.get(资源查询),expressage.save(资源保存),expressage.update(资源更新),expressage.remove(资源删除)。通过以资源(uri)为接口分别对应着后端的get、post、put、delete四种动作。简单来说就是(以$resource服务为基础,后文会谈到到这个服务),前端发出query或者get,后端就收到get请求;前端发出save,后端就收到post请求;前端发出update,后端就收到put请求;前端发出remove,后端就收到delete请求。
三、实验环境与项目dependecies
本次实验使用的前端环境与插件有: AngularJS.js,ngResource.js。其中ngResource用于与支持RESTful后端的数据源进行交互,并创建我们所需要的资源($ bower install --save angular-resource)。数据库使用mongodb。后端环境与插件有:NodeJS,express(3.21.2),mongodb(0.9.9),mongoose(4.4.6),nconf(0.8.4)。其中mongoose是连接node中mongodb的神器,实验中的后端具体实现功能是由它来实现的
四、CRUD
三 . 0 mongoose
Note: 在这里过一过下文会用到的mongose的基本API,有不懂的大家最好再查一查mongoose的使用方法和相关知识点,特别是Model,Entity和Schema之间的关系。Model.find({})全部查询,Model.find({name:'小鹏'})条件查询,Model.save()保存,Model.update()更新,Model.remove()删除。
同时,下面的操作均已事先连接好数据库,连接的方式、mongoose使用方法和相关知识点这里就不多说了。
三 . 1 CRUD之查
三 . 1 . 1 查——无参数类
//---不带参数的查询---前端------------
var Users = $resource('/api/users');
Users.query(function(data){
console.log(data)
}, function(err){
console.log(err)}
)
//---不带参数的查询---后端------------
app.get('/api/users', function(req, res){
return UserModel.find({}, function(err, users){
if(!err){
return res.send(users);
}else{
res.statusCode = 500;
console.log('Get Error...')
return res.send({error: 'Server error'})
}
})
});
三 . 1 . 2 查——带参数类
//---带参数的查询---前端------------
var User = $resource('/api/users/:Username', {
Username: '@Username'
});
User.get({
Username: 'hzp'
}, function(data){
console.log(data)
}, function(err){
console.log(err)
})
//---带参数的查询---后端------------
app.get('/api/users/:Username', function(req, res){
return UserModel.findByName(req.params.Username, function(err, user){
if(!user){
return res.send('找不到该用户')
}else{
return res.send({status: 'OK', user: user})
}
})
});
三 . 2 CRUD之增
//---增操作---前端------------
var User = $resource('api/users');
User.save({}, {
name: 'Ari',
password: '123123'
}, function(data){
console.log(data)
}, function(err){
console.log(err)
})
//---增操作---后端------------
app.post('/api/users', function(req, res){
var newUser = new UserModel({
name: req.body['name'],
password: req.body['password']
})
newUser.save(function(err){
if(err){
console.log("err " + err)
}else if(err === null || err === undefined){
console.log('Save!');
return res.send('成功注册!')
}
})
});
三 . 1 CRUD之改
//---更新操作---前端------------
var User = $resource('/api/users/:Username', {
Username: '@name'
},{
update:{
method: 'PUT'
}
})
User.update({}, {
name: 'hzp',
password: 'hhhhhh'
}, function(data){
console.log(data)
}, function(err){
console.log(err)
})
//---更新操作---后端------------
app.put('/api/users/:name', function(req, res){
UserModel.findByName(req.body['name'], function(err, data){
if(!data){
res.statusCode = 404;
return res.send({err: 'Not Found'})
}else{
var condition = {name: req.body['name']};
var update = {$set: {password: req.body['password']}};
var options = {upsert: true};
UserModel.update(condition, update, options, function(err){
if(err){
console.log(err)
}else{
return res.send('更新成功!')
}
})
}
})
});
三 . 1 CRUD之删
//---更新操作---前端------------
var User = $resource('/api/users/:name',{
name: '@name'
});
User.remove({}, {
name: 'HZP'
}, function(data){
console.log(data)
}, function(err){
console.log(err)
})
//---更新操作---后端------------
app.delete('/api/users/:name', function(req, res){
UserModel.findByName(req.body['name'], function(err, data){
if(data.length <= 0){
res.statusCode = 404;
return res.send({err: 'Not Found'})
}else{
var condition = {name: req.body['name']};
UserModel.remove(condition, function(err){
if(err){
console.log(err)
}else{
return res.send('删除成功')
}
})
}
})
});
五、其它细节
1 . 在使用mongoose编译出来的Model和数据库的表明之间有区别:表名多了一个's'。 var UserModel = mongoose.model('usermessage', UserSchema); 此处编译过程用的是'usermessage'但是数据库中的名字是'usermessages'——多了一个's'
AngularJS+Node的RESTful之基本实现的更多相关文章
- 基于 Angularjs&Node.js 云编辑器架构设计及开发实践
基于 Angularjs&Node.js 云编辑器架构设计及开发实践 一.产品背景 二.总体架构 1. 前端架构 a.前端层次 b.核心基础模块设计 c.业务模块设计 2. Node.js端设 ...
- Angularjs+node+Mysql实现地图上特定点的定位以及附加信息展示
注:本博文为博主原创,转载请注明出处. 在上一篇博文中主要讲述了如何利用AngularJs+Node+MySql构建项目,并实现地图上的多点标注,今天在这篇文章中,我们将在上一个项目的基础上,实现特定 ...
- Node.js RESTful API
什么是REST架构? REST表示代表性状态传输.REST是一种基于Web标准的架构,并使用HTTP协议. 它都是围绕着资源,其中每一个组件是资源和一个资源是由一个共同的接口使用HTTP的标准方法获得 ...
- AngularJS + Node.js + MongoDB开发
AngularJS + Node.js + MongoDB开发的基于位置的通讯录(by vczero) 一.闲扯 有一天班长说了,同学们希望我开发一个可以共享位置的通讯录,于是自己简单设计了下功能.包 ...
- Angularjs+node+Mysql实现地图上的多点标注
注:本文适合对于node有一定基础的人,如果您是小白,请先用1个小时学习node.node文档https://nodejs.org/en/docs/ 该片博文的源码地址:https://github. ...
- [MEAN+ Webstrom] First API -- 2.Debug Node.js RESTful application
Using WebStrom can easily debug the Node applcation. For example, we have an Node+Express applicatio ...
- 一个完整的Node.js RESTful API
前言 这篇文章算是对Building APIs with Node.js这本书的一个总结.用Node.js写接口对我来说是很有用的,比如在项目初始阶段,可以快速的模拟网络请求.正因为它用js写的,跟i ...
- AngularJS+Node.js+socket.io 开发在线聊天室
所有文章搬运自我的个人主页:sheilasun.me 不得不说,上手AngularJS比我想象得难多了,把官网提供的PhoneCat例子看完,又跑到慕课网把大漠穷秋的AngularJS实战系列看了一遍 ...
- 49.Node.js RESTful API
转自:http://www.runoob.com/nodejs/nodejs-express-framework.html 什么是 REST? REST即表述性状态传递(英文:Representati ...
随机推荐
- iOS 学习 - 10下载(3) NSURLSession 音乐 篇
使用 NSURLSession 下载,需要注意的是文件下载文件之后会自动保存到一个临时目录,需要开发人员自己将此文件重新放到其他指定的目录中 // // ViewController.m // Web ...
- qq邮箱过滤器 + Foxmail(IMAP)
一.qq邮箱过滤器 二.Foxmail+ IMAP,实现自定义目录下载 IMAP介绍,和POP比较 如何在Foxmail中配置IMAP
- Maven基础配置--nexus私服配置
登录nexus私服后台,按照下图1-3的顺序进行添加仓库: 其中步骤3有三种仓库类型(Type)进行选择 1. Hosted Repository:本地仓库,在私服服务器上存放用户自行上传的jar包: ...
- .Net Attribute详解(下) - 使用Attribute武装枚举类型
接上文.Net Attribute详解(上)-Attribute本质以及一个简单示例,这篇文章介绍一个非常实用的例子,相信你一定能够用到你正在开发的项目中.枚举类型被常常用到项目中,如果要使用枚举To ...
- 驳 GarbageMan 的《一个超复杂的简介递归》——对延迟计算的实验和思考
这是一篇因骂战而起的博文,GarbageMan 在该文章回复中不仅对我进行了侮辱,还涉及了我的母校,特写此文用理性的分析和实验予以回击. 在此也劝告 GarbageMan,没什么本事就别在那叫嚣了,还 ...
- 挖一挖C#中那些我们不常用的东西之系列(1)——ToDictionary,ToLookup
这个系列我们看看C#中有哪些我们知道,但是又不知道怎么用,又或者懒得去了解的东西,比如这篇我们要介绍的toDictionary 和ToLookup. 从图中我们看到有四个ToXXX的方法,其中ToAr ...
- mysql主从日志的定期清理
mysql主从的binlog定时删除是很重要的,一般是通过expire_logs_days = 10来设置binlog保留的天数(mysql5.0一下版本不支持),但有时这还不够,假如有几天的日志量非 ...
- PostgreSql常用脚本
添加表字段 ALTER TABLE public.university ADD COLUMN "Province" character varying(10); COMMENT O ...
- [转]How to add new table in NopCommerce
本文转自:http://www.tech-coder.com/2015/07/how-to-add-new-table-in-nopcommerce.html Hey guys I am back a ...
- Java对象序列化文件追加对象的问题,以及Java的读取多个对象的问题解决方法。
这几天做一个小的聊天项目用到对象序列化的知识,发现对象序列化不能像普通文件一样直接追加对象.每次写入对象都会被覆盖.弄了2个多小时终于解决了.Java默认的对象序列化是每次写入对象都会写入一点头ace ...