cp from : https://www.codercto.com/a/9839.html
mock.js 可以模拟ajax数据，拦截ajax请求，返回模拟数据，无需后端返回就可以测试前端程序
引入文件
首先在head头中引入我们需要的mockjs文件
<script src="//upyun1.codercto.com/images/1x1.png" data-original="http://mockjs.com/dist/mock.js"></script>
定义数据
在ajax请求之前，用mack定义返回数据
Mock.mock(‘http://laoyu‘, { "errorcode": 0,//0表示成功，1表示错误 "message": "xx信息不完整", //弹出错误信息});创建请求
在ajax中,open()的url要与mock中的相同，比如我这里是 http://laoyu ,那么
XHR.open（"post/get","http://laoyu",true/false）
测试
好了，说到这里，我们进行测试一下
<script> ???//调用mock方法模拟数据Mock.mock(‘http://laoyu‘, { ?"errorcode": 0,//0表示成功，1表示错误 ?"message": "xx信息不完整", //弹出错误信息}); ???//使用ajax进行测试var xhr = new XMLHttpRequest();xhr.open("post","http://laoyu",true);xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");xhr.send(null);xhr.onreadystatechange = function(){ ???if(xhr.readyState == 4){ ???????if((xhr.status>=200 && xhr.status<300) || xhr.status== 304){ ???????????var data = JSON.parse(xhr.responseText); ???//因为reponseText返回的是字符串，将字符串转换成我们想要的JSON数据，这样就可以调用了 ???????????????????????console.log(data); ?//在控制台中打印出返回的内容 ???????}else{ ???????????alert("Request was unsuccessful: " + xhr.status); ???????} ???}}</script>看到没，返回了我们使用mock模拟的数据，这样就可以无需后台，直接进行自己的测试了
xhr.readyState的五种状态
0 － （未初始化）还没有调用open()方法 1 － （服务器连接已经建立）已调用open()方法，正在发送请求 2 － （请求已接收）send()方法执行完成，已经接收到全部响应内容 3 － （请求处理中）正在解析响应内容 4 － （请求已完成）响应内容解析完成，可以在客户端调用了
链接：https://www.codercto.com/a/9839.html
来源：Coder·码农
本文发布于 Coder·码农，转载请注明出处，谢谢合作！
[Web 前端] ??mockjs让前端开发独立于后端
原文地址：https://www.cnblogs.com/0616--ataozhijia/p/9152959.html