成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

jquery ajax 方法封裝及 api 文件設(shè)計(jì)

leone / 2881人閱讀

摘要:封裝文件封裝例如命令數(shù)據(jù)用來記錄每次請(qǐng)求的唯一標(biāo)識(shí)唯一標(biāo)識(shí)生成方法模塊主體獲取失敗比對(duì)請(qǐng)求保證返回結(jié)果的正確性重復(fù)請(qǐng)求有可能會(huì)帶來返回結(jié)果不可靠的問題的默認(rèn)設(shè)置服務(wù)器已經(jīng)錯(cuò)誤將大于的數(shù)字位以上包裹雙引號(hào)避免溢出這里是根據(jù)后臺(tái)

封裝 jquery ajax 文件
/**
 * 封裝 jquery ajax 
 * 例如:
 * ajaxRequest.ajax.triggerService(
 *   "apiCommand", [命令數(shù)據(jù)] )
 *   .then(successCallback, failureCallback);
 * );
 */
var JSON2 = require("LibsDir/json2");
var URL = "../AjaxHandler.aspx?r=";

// 用來記錄每次請(qǐng)求的唯一標(biāo)識(shí)
var requestIdentifier = {};

// 唯一標(biāo)識(shí)生成方法
function generateGUID() {
  var d = new Date().getTime();
  if (typeof performance !== "undefined" && typeof performance.now === "function") {
    d += performance.now();
  }
  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
    var r = (d + Math.random() * 16) % 16 | 0;
    d = Math.floor(d / 16);
    return (c === "x" ? r : (r & 0x3 | 0x8)).toString(16);
  });
}

// 模塊主體
var ajaxRequest = ajaxRequest || {};
(function ($) {
  if (!$) {
    throw "jquery獲取失敗!";
  }

  ajaxRequest.json = JSON2;
  ajaxRequest.ajax = function (userOptions, serviceName, requestId) {
    userOptions = userOptions || {};
    var options = $.extend({}, ajaxRequest.ajax.defaultOpts, userOptions);
    options.success = undefined;
    options.error = undefined;
    return $.Deferred(function ($dfd) {
      $.ajax(options)
        .done(function (result, textStatus, jqXHR) {
          if (requestId === requestIdentifier[serviceName]) {
            // 比對(duì)請(qǐng)求id, 保證返回結(jié)果的正確性 (重復(fù)請(qǐng)求有可能會(huì)帶來返回結(jié)果不可靠的問題)
            ajaxRequest.ajax.handleResponse(result, $dfd, jqXHR, userOptions, serviceName, requestId);
          }
        })
        .fail(function (jqXHR, textStatus, errorThrown) {
          if (requestId === requestIdentifier[serviceName]) {
            // jqXHR.status
            $dfd.reject.apply(this, arguments);
            userOptions.error.apply(this, arguments);
          }
        });
    });
  };

  $.extend(ajaxRequest.ajax, {
    // $.ajax() 的默認(rèn)設(shè)置
    defaultOpts: {
      // url: "../AjaxSecureHandler.aspx,
      dataType: "json",
      type: "POST",
      contentType: "application/x-www-form-urlencoded; charset=UTF-8"
    },

    handleResponse: function (result, $dfd, jqXHR, userOptions, serviceName, requestId) {
      if (!result) {
        $dfd && $dfd.reject(jqXHR, "error response format!");
        userOptions.error(jqXHR, "error response format!");
        return;
      }

      // 服務(wù)器已經(jīng)錯(cuò)誤
      if (result.ErrorCode != "200") {
        $dfd && $dfd.reject(jqXHR, result.ErrorMessage);
        userOptions.error(jqXHR, result);
        return;
      }

      if (result.Data) {
        // 將大于2^53的數(shù)字(16位以上)包裹雙引號(hào), 避免溢出
        var jsonStr = result.Data.replace(/(:s*)(d{16,})(s*,|s*})/g, "$1"$2"$3");
        var resultData = ajaxRequest.json.parse(jsonStr);
        $dfd.resolve(resultData);
        userOptions.success && userOptions.success(resultData);
      } else {
        $dfd.resolve();
        userOptions.success && userOptions.success();
      }
    },

    buildServiceRequest: function (serviceName, input, userSuccess, userError, ajaxParams) {
      // 這里是根據(jù)后臺(tái)要求構(gòu)建的
      var requestData = {
        MethodAlias: serviceName, // 方法名
        Parameter: input // 傳遞的參數(shù)
      };

      var request = $.extend({}, ajaxParams, {
        // 這里要對(duì)傳遞的 JSON 字符串參數(shù)數(shù)據(jù)使用 escape 方法進(jìn)行編碼
        // "data=" 是根據(jù)項(xiàng)目約定增加的,與 contentType 相對(duì)應(yīng)
        data: "data=" + escape(ajaxRequest.json.stringify(requestData)),
        success: userSuccess,
        error: function (jqXHR, textStatus, errorThrown) {
          // 這里是在請(qǐng)求出錯(cuò)的時(shí)候做一個(gè)統(tǒng)一處理, 輸出方法名和錯(cuò)誤對(duì)象
          console.log(serviceName, jqXHR);
          if (userError && (typeof userError === "function")) {
            userError(jqXHR, textStatus, errorThrown);
          }
        }
      });

      return request;
    },

    // 構(gòu)建參數(shù)對(duì)象, 生成唯一標(biāo)識(shí), 觸發(fā)請(qǐng)求
    triggerService: function (serviceName, input, success, error, ajaxParams) {
      var request = ajaxRequest.ajax.buildServiceRequest(serviceName, input, success, error, ajaxParams);
      // 生成此次 ajax 請(qǐng)求唯一標(biāo)識(shí)
      var requestId = requestIdentifier[serviceName] = generateGUID();
      request.url = URL + requestId;
      return ajaxRequest.ajax(request, serviceName, requestId);
    }
  });

})(jQuery);

module.exports = ajaxRequest;
api 文件示例
/**
 * api 接口定義
 * 這個(gè)示例中假設(shè)后臺(tái)服務(wù)要求接受數(shù)組形式的參數(shù)
 */
var ajaxRequest = require("../common/ajax-request"); // ajax 封裝
var JSON2 = require("LibsDir/json2");

// 請(qǐng)求數(shù)據(jù)方法
var apiService = (function () {
  var request = {};
  // 產(chǎn)品列表 (參數(shù)需要進(jìn)一步處理的情況)
  request.getProductListData = function (conditionObj) {
    return ajaxRequest.ajax.triggerService("SearchProductList", [JSON2.stringify(conditionObj)]);
  };

  // 搜索熱詞 (參數(shù)為空的情況)
  request.getHotWords = function () {
    return ajaxRequest.ajax.triggerService("GetSearchHotKeys", []);
  };

  // 獲取用戶配置
  request.getUserConfig = function () {
    return ajaxRequest.ajax.triggerService("GetUserConfig", []);
  };

  // 設(shè)置用戶配置
  request.setUserConfig = function (params) {
    return ajaxRequest.ajax.triggerService("SetUserConfig", [params]);
  };

  return request;
})();

module.exports = apiService;
業(yè)務(wù)代碼中調(diào)用 api 接口
// 綜合搜索熱詞查詢
apiService.getHotWords()
  .then(function (result) {
    if (result.length > 0) {
      // 成功回調(diào)
      // handleResult(result);
    }
  })
  .fail(function (err) {
    console.log("GetSearchHotKeys: ", err);
    // 失敗回調(diào)
    handleResult();
  });

文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/103026.html

相關(guān)文章

  • jquery ajax 方法封裝說明

    摘要:簡(jiǎn)要說明前面我寫了一篇方法封裝及文件設(shè)計(jì)文檔,主要用來說明我們?cè)陧?xiàng)目中通常會(huì)對(duì)的方法進(jìn)行進(jìn)一步的封裝處理,便于我們?cè)跇I(yè)務(wù)代碼中使用。這篇文檔我們主要對(duì)封裝的方法進(jìn)行一個(gè)簡(jiǎn)要說明。 簡(jiǎn)要說明 前面我寫了一篇《jquery ajax 方法封裝及 api 文件設(shè)計(jì)》文檔,主要用來說明我們?cè)陧?xiàng)目中通常會(huì)對(duì) jquery 的 ajax 方法進(jìn)行進(jìn)一步的封裝處理,便于我們?cè)跇I(yè)務(wù)代碼中使用。從那篇文...

    z2xy 評(píng)論0 收藏0
  • 學(xué)Java編程需要注意的地方

    摘要:學(xué)編程真的不是一件容易的事不管你多喜歡或是多會(huì)編程,在學(xué)習(xí)和解決問題上總會(huì)碰到障礙。熟練掌握核心內(nèi)容,特別是和多線程初步具備面向?qū)ο笤O(shè)計(jì)和編程的能力掌握基本的優(yōu)化策略。   學(xué)Java編程真的不是一件容易的事,不管你多喜歡或是多會(huì)Java編程,在學(xué)習(xí)和解決問題上總會(huì)碰到障礙。工作的時(shí)間越久就越能明白這個(gè)道理。不過這倒是一個(gè)讓人進(jìn)步的機(jī)會(huì),因?yàn)槟阋恢辈粩嗟膶W(xué)習(xí)才能很好的解決你面前的難題...

    leanxi 評(píng)論0 收藏0
  • Ajax在vue中的封裝使用

    摘要:今天給大家寫一篇關(guān)于在中的應(yīng)用及封裝,有些同學(xué)可能會(huì)有疑問,因?yàn)槭煜さ亩贾?,中有和是專門用于交互的,那么豈不是多此一舉嗎其實(shí)不然,有的優(yōu)勢(shì),并且小編本身對(duì)有著特殊的感情,今天就給大家詳細(xì)詳解在中的應(yīng)用。 今天給大家寫一篇關(guān)于ajax在vue中的應(yīng)用及封裝,有些同學(xué)可能會(huì)有疑問,因?yàn)槭煜ue的都知道,vue中有vue-resource和axios是專門用于http交互的,那么ajax...

    godruoyi 評(píng)論0 收藏0
  • Ajax在vue中的封裝使用

    摘要:今天給大家寫一篇關(guān)于在中的應(yīng)用及封裝,有些同學(xué)可能會(huì)有疑問,因?yàn)槭煜さ亩贾?,中有和是專門用于交互的,那么豈不是多此一舉嗎其實(shí)不然,有的優(yōu)勢(shì),并且小編本身對(duì)有著特殊的感情,今天就給大家詳細(xì)詳解在中的應(yīng)用。 今天給大家寫一篇關(guān)于ajax在vue中的應(yīng)用及封裝,有些同學(xué)可能會(huì)有疑問,因?yàn)槭煜ue的都知道,vue中有vue-resource和axios是專門用于http交互的,那么ajax...

    pingink 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<