Node.js服务器环境下使用Mock.js拦截AJAX请求的教程


Posted in Javascript onMay 23, 2016

0、Node环境下安装和使用Mock

# 安装
npm install mockjs
// 使用 Mock
var Mock = require('mockjs')
var data = Mock.mock({
  // 属性 list 的值是一个数组,其中含有 1 到 10 个元素
  'list|1-10': [{
    // 属性 id 是一个自增数,起始值为 1,每次增 1
    'id|+1': 1
  }]
})
// 输出结果
console.log(JSON.stringify(data, null, 4))

1、拦截 ajax 请求调用
方法如下

Mock.mock( rurl?, rtype?, template|function( options ) )

方法说明:
(1)rurl: 可选参数。

表示需要拦截的 URL,可以是 URL 字符串或 URL 正则。例如 /\/domain\/list\.json/、'/domian/list.json'。
(2)rtype:可选参数。

 表示需要拦截的 Ajax 请求类型。例如 GET、POST、PUT、DELETE 等。
(3)template|function:必选参数,只取其中一项。

(4)template 表示数据模板,可以是对象或字符串。例如 { 'data|1-10':[{}] }、'@EMAIL'。
(5)function 指向本次请求的 Ajax 选项集,含有 url、type 和 body 三个属性,参见 XMLHttpRequest 规范。
提示

从 1.0 开始,Mock.js 通过覆盖和模拟原生 XMLHttpRequest 的行为来拦截 Ajax 请求,不再依赖于第三方 Ajax 工具库(例如 jQuery、Zepto 等)。

2. 拦截 Ajax 请求超时
配置拦截 Ajax 请求时的行为。支持的配置项有:timeout。

(1)Mock.setup( settings )
(2)settings
必选。
配置项集合。
(3)timeout
可选。
指定被拦截的 Ajax 请求的响应时间,单位是毫秒。值可以是正整数,例如 400,表示 400 毫秒 后才会返回响应内容;也可以是横杠 '-' 风格的字符串,例如 '200-600',表示响应时间介于 200 和 600 毫秒之间。默认值是'10-100'。

3. 本人理解的拦截
使用同一个方法名,去栏截指定方法。通过 call 修改 this 指向,到达 拦截。

// 实现原理
// 定义父类
var mock_ajax = function(str){
 this.showName=function(){
 console.log(str);
 }
 return this;
};
// 定义子类
var jquery_ajax = function(str){
 this.showName = function(){
 console.log('ajax');
 }
 return this;
};

jquery_ajax('').showName();// -> ajax

// 改变 this 指向
mock_ajax.call(jquery_ajax,'111');
// 调用
jquery_ajax.showName();
Javascript 相关文章推荐
JavaScript 继承详解(一)
Jul 13 Javascript
基于jquery的超简单上下翻
Apr 20 Javascript
qTip2 精致的基于jQuery提示信息插件
Feb 17 Javascript
jquery封装的对话框简单实现
Jul 21 Javascript
屏蔽script注入小例子
Nov 12 Javascript
jquery实现简单易懂的图片展示小例子
Nov 21 Javascript
javascript动态设置样式style实例分析
May 13 Javascript
jQuery获取当前点击的对象元素(实现代码)
May 19 Javascript
jQuery中事件与动画的总结分享
May 24 Javascript
详解Node.js项目APM监控之New Relic
May 12 Javascript
JavaScript设计模式之单例模式原理与用法实例分析
Jul 26 Javascript
如何使JavaScript休眠或等待
Apr 27 Javascript
谈一谈bootstrap响应式布局
May 23 #Javascript
JavaScript实现复制或剪切内容到剪贴板功能的方法
May 23 #Javascript
JavaScript的Vue.js库入门学习教程
May 23 #Javascript
详解JavaScript中|单竖杠运算符的使用方法
May 23 #Javascript
AJAX实现瀑布流触发分页与分页触发瀑布流的方法
May 23 #Javascript
jQuery Mobile中的button按钮组件基础使用教程
May 23 #Javascript
jQuery实现页面评论栏中访客信息自动填写功能的方法
May 23 #Javascript
You might like
PHP实现用户认证及管理完全源码
2007/03/11 PHP
php中对xml读取的相关函数的介绍一
2008/06/05 PHP
解析PHP多种序列化与反序列化的方法
2013/06/06 PHP
php实现建立多层级目录的方法
2014/07/19 PHP
简单谈谈PHP中的include、include_once、require以及require_once语句
2016/04/23 PHP
$.ajax json数据传递方法
2008/11/19 Javascript
cookie在javascript中的使用技巧以及隐私在服务器端的设置
2012/12/03 Javascript
jquery获取颜色在ie和ff下的区别示例介绍
2014/03/28 Javascript
jQuery实现contains方法不区分大小写的方法
2015/02/13 Javascript
深入理解JavaScript系列(17):面向对象编程之概论详细介绍
2015/03/04 Javascript
JavaScript中的parse()方法使用简介
2015/06/12 Javascript
javascript实现网页屏蔽Backspace事件,输入框不屏蔽
2015/07/21 Javascript
Javascript发送AJAX请求实例代码
2016/08/21 Javascript
JS简单实现tab切换效果的多窗口显示功能
2016/09/07 Javascript
AngularJS使用angular.bootstrap完成模块手动加载的方法分析
2017/01/19 Javascript
微信小程序实现星级评分和展示
2018/07/05 Javascript
JavaScript Tab菜单实现过程解析
2020/05/13 Javascript
vue 动态给每个页面添加title、关键词和描述的方法
2020/08/28 Javascript
[22:20]初生之犊-TI4第5名LGD战队纪录片
2014/08/13 DOTA
使用IronPython把Python脚本集成到.NET程序中的教程
2015/03/31 Python
在Python中输入一个以空格为间隔的数组方法
2018/11/13 Python
python程序快速缩进多行代码方法总结
2019/06/23 Python
使用Python脚本zabbix自定义key监控oracle连接状态
2019/08/28 Python
Python代理IP爬虫的新手使用教程
2019/09/05 Python
Python基于xlutils修改表格内容过程解析
2020/07/28 Python
python requests库的使用
2021/01/06 Python
python asyncio 协程库的使用
2021/01/21 Python
CSS3中的clip-path使用攻略
2015/08/03 HTML / CSS
美国著名童装品牌:OshKosh B’gosh
2016/08/05 全球购物
Paradox London官方网站:英国新娘鞋婚礼鞋品牌
2019/08/29 全球购物
主持人演讲稿
2014/05/13 职场文书
2014年实习班主任工作总结
2014/11/08 职场文书
《圆的面积》教学反思
2016/02/19 职场文书
初中政治教学反思
2016/02/23 职场文书
实用求职信模板范文
2019/05/13 职场文书
CocosCreator入门教程之网络通信
2021/04/16 Javascript