利用node.js来mock假数据

利用node.js来mock假数据

1：首先要先安装node.js.这个就不说了。可以参考我的这篇文章（ode.js利用gulp 启动webServer服务）http://blog.csdn.net/seven0404/article/details/51880162

2：先说一下思路

1：我们在js中发送ajax请求。

2：启动node.js的webserver服务。进行拦截本地服务下的网络数据请求

3：使用if或者是switch从所有拦截到的地址中找到自己发送请的那个地址，然后拦截下这和请求。其他的请求使用next（）方法放过

4: 拦截到我们想要的请求后，将我们mock的假数据的json文件返回给我们js里面的ajax

5：成功就展示出我们请求的数据

3:步骤

1：安装node.js

2: 局部安装gulp和gulp-webserver

3: js发送ajax请求（这里使用的是jQ的发送请求的方法）

4：新建一个gulpfile.js

5：在gulpfile.js中处理拦截逻辑。拦截到后将mock假数据返回

6：在js中解析返回的数据

代码：

js代码：

$.ajax({
type:"get",
url:"mocktest/index.html",
datatype:'json',
success:function(data){
console.log(data)
},
error:function(){
$('.one').html('请求失败')
}
});

gulpfile.js代码

//引入gulp
var gulp = require('gulp');
//引入webserver插件
var webserver = require('gulp-webserver');
//引入node.js的内置模块
var url = require('url'); //可以对url进行操作
var fs = require('fs'); //文件操作对象
//创建启动webserver的任务
gulp.task('webserver', function() {
gulp.src('./')
.pipe(webserver({
port: 8080, //端口
host: 'localhost', //域名
liveload: true,
directoryListing: {
path: './',
enable: true
},


//拦截这个本地服务下的网络请求


middleware: function(req, res, next) {
var urlObj = url.parse(req.url, true);
var path = urlObj.pathname;
console.log(path)
if(path=='/mocktest/index.html'){
//拦截$http发送出来的请求
//封装响应返回
//设置响应头
res.setHeader('Content-Type', 'application/json');
//读取文件作为响应的内容
fs.readFile('storyList_3.json', 'utf-8', function(err, data) {
res.end(data);
})

return;
}
next();
}



}));
})

注意：

1：每次改了gulpfile.js代码后都需要重启一次服务才会生效

已上传了demo。已经将gulp删除了。gulp删除后可通过npm install安装回来

百度网盘

http://pan.baidu.com/s/1boLHBzT