Json-Server模拟数据接口开发
2017-08-27 18:17
357 查看
前端开发过程中调用后台接口是常事,在前后台定义好接口规范和参数后,后台接口的进度有时会成为我们的掣肘,这里推荐使用一款简单的小工具json-server,小而轻便。
确保本地已有node环境。
运行完后本地就已经生成了两个API,在浏览器输入localhost:3000/posts就会出现相应数据,如下图:
或者是这样的 $.get('localhost:3000/posts',function(){});
GET : 获取数据(获取表单列表数据)
POST : 新增数据(新增一个表单项)
DELETE :删除数据(删除一条表单数据)
PATCH :更新数据 (修改一条表单数据)//根据某个属性修改,上传修改的某个属性
PUT :更新数据(修改一条表单数据)//更新整条数据,上传修改的整条数据
github地址:https://github.com/typicode/json-server
确保本地已有node环境。
一:安装json-server
npm install -g json-server二:创建json-server文件
在项目文件夹创建一个文件夹,随意命名,这里命名为API-server,在API-server文件夹下创建json格式文件,这里命名为db.json。如下图:
三:创建数据并启动json服务
在第二部创建的db.json文件中填充json数据:如下图:插入完数据后,cd 到 api-server文件夹下启动json服务,运行 json-server --watch db.json 如下图:
运行完后本地就已经生成了两个API,在浏览器输入localhost:3000/posts就会出现相应数据,如下图:
四:进行应用
现在本地已经生成了相应的api接口,可以使用ajax进行相应接口调用,接口会返回相应的数据。如下图:
或者是这样的 $.get('localhost:3000/posts',function(){});
五:修改监听端口
修改监听端口,可以开启多个终端进行多个json文件的监听 json-server --watch -port 8888 db.json(监听8888端口)
六:RESTful风格接口实现CURD:
RESTful API设计指南:推荐阮一峰的(http://www.ruanyifeng.com/blog/2014/05/restful_api.html) 根据请求方法的不同来实现不同的目的
GET : 获取数据(获取表单列表数据)
POST : 新增数据(新增一个表单项)
DELETE :删除数据(删除一条表单数据)
PATCH :更新数据 (修改一条表单数据)//根据某个属性修改,上传修改的某个属性
PUT :更新数据(修改一条表单数据)//更新整条数据,上传修改的整条数据
七:数据过滤
数据过滤是json-server中非常强劲的功能,通过url加上简单的query字段,即可以过滤得到各种各样的数据
八:表单分页的简单实现
json-server的高级定义,高级过滤等(未完待续!!!)
github地址:https://github.com/typicode/json-server
相关文章推荐
- Json-Server模拟数据接口开发
- webpack4.0.1_vue脚手架的项目与json-server结合,vue开发前端时用json-server模拟数据
- json-server模拟接口获取mock数据
- webpack4.0.1_vue脚手架的项目与json-server结合,vue开发前端时用json-server模拟数据,fetch的请求代码
- 模拟基于ajax调后台接口的json数据
- HttpClient模拟客户端向 服务器接口 传递 Json 数据
- php开发安卓服务器之 php封装json xml通用app数据通信接口
- mockjs,json-server一起搭建前端通用的数据模拟框架
- App开发:模拟服务器数据接口 - MockApi
- App开发:模拟服务器数据接口 - MockApi
- App开发:模拟服务器数据接口 - MockApi
- Vue-cli 使用json server在本地模拟请求数据的示例代码
- json-server模拟接口获取mock数据
- vs2015开发webserver 返回json格式 实现图书编目数据接口
- 前端模拟数据模型-json-server-配置
- vue-resource + json-server模拟数据的方法
- 使用json-server模拟后台数据
- iOS开发之模拟接口假数据
- 关于http接口开发中json格式数据编码问题处理
- (017)java后台开发之客户端通过HTTP获取接口Json数据