99%的程序都沒有考慮的網絡異常？使用Fundebug.notify()主動上報

近日看到一篇文章99%的程序都沒有考慮的網絡異常，開篇提到：

絕大多數程序只考慮了接口正常工做的場景，而用戶在使用咱們的產品時遇到的各種異常，全都丟在看似 ok 的 try catch 中。若是沒有作好異常的兼容和兜底處理，會極大的影響用戶體驗，嚴重的還會帶來安全和資損風險。

因而，筆者分析了 GitHub 上的一些開源微信小程序，發現大多數的代碼異常處理確實是不夠的。

• 登陸接口只考慮成功的狀況，沒考慮失敗的狀況

//調用登陸接口
wx.login({
    success: function() {
        wx.getUserInfo({
            success: function(res) {
                that.globalData.userInfo = res.userInfo;
                typeof cb == "function" && cb(that.globalData.userInfo);
            }
        });
    }
});
複製代碼

• 網絡請求只考慮then不考慮catch

  util.getData(index_api).then(function(data) {
      //this.setData({
      //
      //});
      console.log(data);
  });
  複製代碼

• 考慮了異常狀況可是沒有作妥善的處理

  db.collection("config")
      .where({})
      .get()
      .then(res => {
          console.log(res);
          if (res.data.length > 0) {
              Taro.setStorage({
                  key: "config_gitter",
                  data: res.data[0]
              });
          }
      })
      .catch(err => {
          console.error(err);
      });
  複製代碼

也許 99%的狀況下接口都是正常返回的，只有 1%的狀況會失敗。看起來好像不是一件嚴重的事情，可是考慮到用戶的量級，這個事情就不那麼簡單了。假設有 100 萬用戶，那麼就有 1 萬用戶遇到異常狀況，並且若是用戶的使用頻次很高，影響的何止 1 萬用戶。而且，現在產品都是體驗至上，若是遇到這樣的問題，用戶極大可能就棄你而去，流失了客戶就等於流失了收入。

如何妥善地處理接口異常的狀況是一件嚴肅的事情，應當被重視起來。

妥善處理請求異常

那麼，應當如何作呢？首先要定義請求異常的處理代碼，好比微信開放接口的參數中有fail（「接口調用失敗的回調函數」）、Promise 的catch部分；其次，根據異常可能致使的後果，在函數中作相應的處理。若是會致使後續操做失敗、或則界面無反饋，那麼應當在 fail 回調中正確處理；若是你真的認爲基本不可能出問題，那麼至少寫個異常上報。即便出錯了，也知道具體的狀況。

下圖是微信支付接口的參數列表，其中包含了接口調用失敗的回調函數(fail)。

並且官方也給出了示例：

wx.requestPayment({
    timeStamp: "",
    nonceStr: "",
    package: "",
    signType: "MD5",
    paySign: "",
    success(res) {},
    fail(res) {}
});
複製代碼

在回調函數fail中上報異常

爲了確保徹底掌握小程序的運行情況，咱們將異常上報。Fundebug 的微信小程序插件除了能夠自動捕獲異常外，還支持經過API 接口主動上報異常。

根據其官方文檔：

使用 fundebug.notify()，能夠將自定義的錯誤信息發送到 Fundebug

name: 錯誤名稱，參數類型爲字符串

message: 錯誤信息，參數類型爲字符串

option: 可選對象，參數類型爲對象，用於發送一些額外信息

示例：

fundebug.notify("Test", "Hello, Fundebug!", {
 metaData: {
     company: "雲麒",
     location: "廈門"
 }
});
複製代碼

首先在 Fundebug 建立一個小程序監控項目，並按照指示接入插件，而後在app.js的onLaunch函數下面調用wx.requestPayment來進行測試。

Fundebug 的微信小程序插件捕獲並上報了異常：

在metaData標籤還能夠看到咱們配置的 metaData，也就是fail回調函數的res參數。

所以，咱們能夠知道失敗的緣由是訂單過時。

另外，若是在二維碼頁面停留時間太久，也會觸發報錯：

經過簡單的加入幾行代碼，就能夠將小程序的異常狀況瞭如指掌。並且 Fundebug 的微信小程序插件還能夠監控線上 JavaScript 執行異常、自動捕獲wx.request請求錯誤、監控慢 HTTP 請求，推薦你們接入試用！

關於Fundebug

Fundebug專一於JavaScript、微信小程序、微信小遊戲、支付寶小程序、React Native、Node.js和Java線上應用實時BUG監控。 自從2016年雙十一正式上線，Fundebug累計處理了10億+錯誤事件，付費客戶有陽光保險、核桃編程、荔枝FM、掌門1對一、微脈、青團社等衆多品牌企業。歡迎你們免費試用！

版權聲明

轉載時請註明做者 Fundebug以及本文地址： blog.fundebug.com/2019/07/08/…