ajax开发模拟后端数据接口

在做前端开发的时候，特别是一些业务逻辑集中在前端的开发中。我们经常需要自己来模拟获取到后台接口的数据。为什么要模拟？可能后台接口还没有开发完成，可能后台还没有数据返回，可能。。。等等原因。曾经，我也尝试过自己使用nodejs来自己写需要模拟后台接口，但因为种种原因，最后都不了了之，或许是因为太复杂，在开发的时候显得不够人性化。偶然之间，一个转身，我发现了mockjax和mockJSON。

mockjax和mockjson

mockjax主要是可以针对指定的网址进行mock，当Ajax请求网址时进行拦截并回传假的数据。OK，我要的就是这种功能！

mockJSON则有点像是JSON的数据自动生成中心，可以根据我们指定的格式随机生成回传的JSON数据，在需要大量数据时比较有用。

贴上这俩在github的地址，有兴趣的自行围观！

mockjax

mockjson

另外，这两个都是基于jquery开发的插件，所以针对jquery开发流派还是比较有用！

示例

首先，当然还是引入。

<script src="vendor/jquery.1.11.1.js"></script>
<script src="vendor/jquery.mockjax.js"></script>
<script src="vendor/jquery.mockjson.js"></script>


然后我们写一个ajax请求

$(function() {
$.ajax({
url: '/WebApi/test.html',
type: 'GET',
error: function(xhr) {
alert('请求失败');
},
success: function(res) {
alert(res);
}
});
});


由于url不存在，请求失败。然后我们来使用mockjax！

var isAjaxMocked = true;
if (isAjaxMocked) {
$.mockjax({
url: '/WebApi/test.html',
status: 200,
responseTime: 900,
responseText: {'info': 'hello world', 'status': 'success'}
});
}


ok,mock ajax请求成功。而且我们通过设置开关，可以很轻易的在模拟和真实的之间切换。

当需要批量模拟数据时，我们可以使用mockJSON，在这里我就不详细介绍了。