接口combine

EddieChan 發布于2019-08-20 10:39 / 1145人閱讀

摘要：需求描述進行復雜項目開發時，服務端數據接口實現端會把接口拆分的比較細粒度，以方便在更多地方復用。

需求描述

進行復雜項目開發時，服務端(數據接口實現端)會把接口拆分的比較細粒度，以方便在更多地方復用。而拆分后的接口在前端進行組合請求時，通常會出現一個區塊要請求5、6個接口甚至更多接口請求才能拿到想要的數據，過多的數據請求會導致區塊渲染較慢，移動端表現尤為明顯。
為了改善這種情況，也有在服務端再開發一些新接口來進行combine前端需要用的接口，不過開發和維護都不是很好，我們應該把這個過程自動化掉

思路

類比cdn文件combine的思路，前端在請求時對接口動態combine，后端有一個專門處理combine接口的服務接口。我們在這個過程中約定好前后端的數據格式即可

約定

假設我們要請求如下2個接口

接口：
  users/list
參數：
  status=1
  name=xl

接口：
  users/role
參數：
  id=20

我們假設客戶端對上述2個接口combine后發送如下格式的請求到服務端

接口
  api/combine
參數
  apis=[{
      url:"users/list",
      body:{
          status:1,
          name:xl
      }
  },{
      url:"users/role",
      body:{
          id:20
      }
  }]

服務端實現一個固定的api/combine接口，接收到上述數據后，內部再去請求相應的接口，拿到數據后返回如下的數據格式

{
    "users/list":{data:{},ok:true},
    "users/role":{data:{},ok:true}
}

在Magix中的應用

var Service = Magix.Service.extend(function(bag, callback) {
    var bags = bag.get("bags", []); //啟用接口combine后，所有的請求都會走combine，Magix內部會把要請求的bag對象放到bags數組內
    var data = [];
    for (var i = 0; i < bags.length; i++) {
        var params = bags[i].get("params"); //單個接口要發送給服務端的數據
        data.push({
            url: bags[i].get("url"),
            body: params
        });
    }
    $.ajax({
        url: "api/combine",
        data: "apis=" + JSON.stringify(data),
        dataType: "json",
        type:"post",
        success: function(responseData) {
            for (var i = 0; i < bags.length; i++) {//拆分統一返回的數據
                var url = bags[i].get("url");
                var d = responseData[url];//根據url讀取相應的數據
                if (d) {
                    bags[i].set("data", d);//設置數據
                }
            }
            callback();
        }
    });
});

Service.add([{
    name: "list",
    url: "users/list",
    cache: 100000
}, {
    name: "role",
    url: "users/role"
}]);

使用

var s1 = new Service();
s1.all("list", function(err, list) {
    console.log(err, list);
});
setTimeout(function() {
    var s = new Service();

    s.all(["list", "role"], function(err, list, role) {
        console.log(err, list, role);
    });
}, 6000);

兼容之前的所有功能及cache，該功能需要后端根據約定配合，約定并非要按照前面描述的規則，可以自己定義，只需要在Magix.Service.extend中自己處理好即可

Magix是一個區塊化管理框架：https://github.com/thx/magix/...
項目地址：https://github.com/thx/magix
歡迎star與fork

GPU云服務器云服務器 Combining Combinations Combination Combine

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/80251.html

Stream流與Lambda表達式（二) Stream收集器 Collector接口

摘要：一收集器接口陳楊收集器接口匯聚操作的元素類型即流中元素類型匯聚操作的可變累積類型匯聚操作的結果類型接口一種可變匯聚操作將輸入元素累積到可變結果容器中在處理完所有輸入元素后可以選擇將累積的結果轉換為最終表示可選操作歸約操作一、Stream收集器 Collector接口 package com.java.design.java8.Stream; import com.java.desi...

or0fun 2019-08-16 15:13 評論0 收藏0
TensorFlow Wide And Deep 模型詳解與應用

摘要：我們先看看的初始化函數的完整定義，看構造一個模型可以輸入哪些參數我們可以將類的構造函數中的參數分為以下幾組基礎參數我們訓練的模型存放到指定的目錄中。看完模型的構造函數后，我們大概知道和端的模型各對應什么樣的模型，模型需要輸入什么樣的參數。 Wide and deep 模型是 TensorFlow 在 2016 年 6 月左右發布的一類用于分類和回歸的模型，并應用到了 Google Play ...

opengps 2019-04-25 18:17 評論0 收藏0
Java8 collector接口的定制實現

摘要：寫這個文章其實主要是因為剛有個童鞋問了個問題正寫的帶勁安利的實現方式，結果還沒寫完無意發現問題被關閉了哎都寫了一半了又不想放棄，就干脆寫成文章問題主要就是把集合里的數據按照一定大小順序平均分成若干組的問題，看起來挺簡單的，不過我開始看到就想寫這個文章其實主要是因為剛有個童鞋問了個問題https://segmentfault.com/q/10...正寫的帶勁安利Java8的實現方式，結...

zhangwang 2019-08-16 12:08 評論0 收藏0
Stream流與Lambda表達式（四）自定義收集器

摘要：一自定義收集器陳楊將集合轉換為集合存放相同元素二自定義收集器陳楊將學生對象按照存放從中間容器數據類型轉換為結果類型數據類型一致若不一致拋出類型轉換異常對中間容器數據結果類型進行強制類型轉換多個線程同時操作同一個容器并行多線一、自定義SetCustomCollector收集器 package com.java.design.Stream.CustomCollector; impor...

wind5o 2019-08-16 15:13 評論0 收藏0