Node.js服務器環(huán)境下使用Mock.js攔截AJAX請求的教程

字號:


    Mock.js這個JavaScript庫最常見的用法便是被用來攔截AJAX請求,well,這里我們就來看一下Node.js服務器環(huán)境下使用Mock.js攔截AJAX請求的教程:
    0、Node環(huán)境下安裝和使用Mock
    # 安裝
    npm install mockjs
    // 使用 Mock
    var Mock = require('mockjs')
    var data = Mock.mock({
      // 屬性 list 的值是一個數(shù)組,其中含有 1 到 10 個元素
      'list|1-10': [{
        // 屬性 id 是一個自增數(shù),起始值為 1,每次增 1
        'id|+1': 1
      }]
    })
    // 輸出結(jié)果
    console.log(JSON.stringify(data, null, 4))
    1、攔截 ajax 請求調(diào)用
    方法如下
    Mock.mock( rurl?, rtype?, template|function( options ) )
    方法說明:
    (1)rurl: 可選參數(shù)。
    表示需要攔截的 URL,可以是 URL 字符串或 URL 正則。例如 /\/domain\/list\.json/、'/domian/list.json'。
    (2)rtype:可選參數(shù)。
     表示需要攔截的 Ajax 請求類型。例如 GET、POST、PUT、DELETE 等。
    (3)template|function:必選參數(shù),只取其中一項。
    (4)template 表示數(shù)據(jù)模板,可以是對象或字符串。例如 { 'data|1-10':[{}] }、'@EMAIL'。
    (5)function 指向本次請求的 Ajax 選項集,含有 url、type 和 body 三個屬性,參見 XMLHttpRequest 規(guī)范。
    提示
    從 1.0 開始,Mock.js 通過覆蓋和模擬原生 XMLHttpRequest 的行為來攔截 Ajax 請求,不再依賴于第三方 Ajax 工具庫(例如 jQuery、Zepto 等)。
    2. 攔截 Ajax 請求超時
    配置攔截 Ajax 請求時的行為。支持的配置項有:timeout。
    (1)Mock.setup( settings )
    (2)settings
    必選。
    配置項集合。
    (3)timeout
    可選。
    指定被攔截的 Ajax 請求的響應時間,單位是毫秒。值可以是正整數(shù),例如 400,表示 400 毫秒 后才會返回響應內(nèi)容;也可以是橫杠 '-' 風格的字符串,例如 '200-600',表示響應時間介于 200 和 600 毫秒之間。默認值是'10-100'。
    3. 本人理解的攔截
    使用同一個方法名,去欄截指定方法。通過 call 修改 this 指向,到達 攔截。
    // 實現(xiàn)原理
    // 定義父類
    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');
    // 調(diào)用
    jquery_ajax.showName();