日記4(node.js錯誤捕獲&&redux-promise-middleware)

GIRL發表於2017-12-05
原文網址 : https://juejin.im/post/5a1ffde76fb9a0450d10dca3
Node.jsReduxPromise

閒聊

剛到公司寫node.js時，一個不小心程式就崩了，各種錯誤簡直防不勝防。一直知道js單執行緒，也一直知道大概那麼個理兒，可是寫起程式碼來還是很疼～～前兩天部門的一個分享koa2實戰，就提到了koa錯誤捕獲處理這個事情，然後下來自己結合已經踩的坑和一些疑惑總結了一下！

教訓

  • 資源(如路徑)錯誤 (細心一點，一般應該不會存在確定路徑後再更改導致錯誤)
  • 請求引數錯誤 （使用者輸入的資料都是不可靠的！）
    1.前端(antd的from,自定義)會對引數做一的校驗。
    2.後端介面處會藉助Joi做校驗，下面就是自己寫過的一段程式碼，只是換了一下命名：
      import Joi from 'joi';
  <!--傳入的引數必須是陣列物件，且每個物件必須包含type,test1,test2屬性-->
  export const addSchema = {
    payload: {
      schema: Joi.array().items({
        type: Joi.string().required(),
        test1: Joi.number().required(),
        test2: Joi.string().required(),
      }),
    },
  };複製程式碼
  • 資料庫錯誤
    當前端資料到達後臺與資料庫進行互動時，這個發生錯誤的概率即大又不大！大是因為概率真的大，小是因為概率也真的小(廢話！！！).資料庫錯誤其實自己遇到的就有自身原因(死循壞運算元據庫，當然我沒幹過)導致資料庫掛了，還有就是客觀原因(剛請求莫名其妙網剛好斷了~~)
  • 資源未完全啟動
    這個坑自己以前踩過，重啟專案後資源(各種包庫)未完全啟動，自己就重新整理系統和，然後崩了......畢竟react專案真的還是比較龐大的.....
  • 自身程式碼bug (血淚史：如不判斷直接迴圈，取值...)
  • 框架bug (忽略不計)

記性

  • 多學一點，少寫一點問題程式碼
  • try / catch
    try catch 對一般promise非同步無效
    try {
console.log(1);
setTimeout(function(){
  console.log(2);
  throw new Error("This is a test error 2");
 }, 1000);
console.log(3);
} catch(err) {
}
console.log(4); // 1 3 4 2複製程式碼
  • await/async
    順便看下promise,co,callback...
    utils裡面的方法返回給其它後端介面:
      export const testFind = async id => {
    try {
      const result = await Model.find({id});
        return {
          error: 0, // api商量好參數列示的意思
          result,
        };
      } catch (e) {
        return {
          error: 1,
          message: e,
        };
     }
  }複製程式碼
    controller中直接返回給前端promise物件:
       export const testFind = async (request, reply) => {
    const result = await Model.find({id: request.id});
    return reply(result)
   }複製程式碼
  • 前端redux-promise-middleware
    這個庫簡直不要太方便了。它會自己將promise分為三種狀態，不同狀態處理不同的前端，真的節約了很大工作量。這裡後端不論是引數錯誤還是資料庫抑或資源未啟動又或路徑不對，只要錯誤都能捕獲，真的很方便。至少能很大程度上減少系統崩了的可能性.....
    actions.js 
    import axios from 'axios';
export const testFInd = (id) => ({
  type: TEST_FIND,
  payload: axios.post('/api/tests/list', {id}),
});複製程式碼
    reducer.js
    import { fromJS } from 'immutable';
import { PENDING, FULFILLED, REJECTED } from 'redux-promise-middleware';
import { message } from 'antd';
const INITIAL_STATE = fromJS({
  list: {},
  loading: false,
})
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
  case `${TEST_FIND}_${PENDING}`:
    return state.set('loading', true);
  case `${TEST_FIND}_${FULFILLED}`:
    return state
      .set('loading', false)
      .update('list', () => fromJS(action.payload.data));
  case `${TEST_FIND}_${REJECTED}`:
    message.error('oops, error');
    return state.set('loading', false);
  default:
    return state;
  }
};複製程式碼

nrm

經常需要切換倉庫地址，於是剛才安裝了nrm！

工作小插曲：

本來今天的打算工作任務做完後補一下專案中的前端單元測試(寫過，不過當沒寫)，但是由於一點自己的bug，花時間去看了一下總監以前寫的一個日誌元件，就沒有多餘的時間補了！那個js元件的各種語法用得很炫酷。人與人之間的差距還是很大啊～～～

明日任務

  • 上面提到了js單執行緒，由於自己以前寫PHP的，明天花點時間對比一下js和PHP。

相關文章