search

TaiBIF / camera-trap-vueapp

A proper implementation using Vue.js.
Apache License 2.0
1 stars 1 forks source link

錯誤提示顯示方式制定 #26

Open diabloevagto opened 5 years ago

diabloevagto commented 5 years ago

@cjk-halodule 有關之前討論到 API error 的提示, 是前端依照 status code 顯示對應的文字資訊給使用者對嗎？ 所以應該可以統一都用跳出視窗顯示即可？

_Originally posted by @oahehc in https://github.com/TaiBIF/camera-trap-vueapp/pull/25#discussion_r277133795

ghost commented 5 years ago

是的。有和 @kelp404 討論到要列出後端會回傳的錯誤訊息及狀態的列表，然後再對應給前端用來和使用者說明的文字。我們先在這裡共筆好了...

ghost commented 5 years ago

@diabloevagto @oahehc @f2ejack

我把目前幾個前端反映狀態給使用者的類型另外整理在一頁： TaiBIF Camera Trap wireframe v20190513 (dragged).pdf

目前在 camera-trap-api 中掃到 400 的錯誤先列在這裡，看看這對於實作有否幫助？

@kelp404 其中的文字可能要請您幫忙看看是不是 makes sense？

然後，有些錯誤可能 logging 起來比和使用者詳細說明重要，再請大家處理到時提議了。

kelp404 commented 5 years ago

我覺得錯誤提示由前端的表單驗證處理，如果需要後端邏輯驗證的話加開 API，例如新增計畫成員前檢查帳號是否存在。 目前 API 的錯誤提示都是給開發者用的，而且有些沒有說明原因，所以表格中沒有 message。 但這些錯誤都是不該發生的，例如使用者在一個不存在的計畫新增相機位置、對不存在的相機位置上傳 csv...。

等下一階段看要不要制定錯誤代碼，因為一個錯誤原因就要一個錯誤代碼，這會非常花時間。

錯誤都有紀錄，有 error stack，只要版號一致就能對得起來是哪一行報錯。

螢幕快照 2019-05-13 下午6 29 25
ghost commented 5 years ago

剛在表格中將前端明顯是應由表單驗證的錯誤加上 FV。 表格中沒有資訊的項目如果是前端必須回應使用者的情況，目前就提示使用者可以回報給系統管理員。

也針對 @kelp404 的建議開了一個下階段的待辦事項。

hsieh-sunghai commented 5 years ago

我覺得錯誤提示由前端的表單驗證處理，如果需要後端邏輯驗證的話加開 API，例如新增計畫成員前檢查帳號是否存在。 目前 API 的錯誤提示都是給開發者用的，而且有些沒有說明原因，所以表格中沒有 message。 但這些錯誤都是不該發生的，例如使用者在一個不存在的計畫新增相機位置、對不存在的相機位置上傳 csv...。

等下一階段看要不要制定錯誤代碼，因為一個錯誤原因就要一個錯誤代碼，這會非常花時間。

錯誤都有紀錄，有 error stack，只要版號一致就能對得起來是哪一行報錯。

螢幕快照 2019-05-13 下午6 29 25

的確, 至少在表單的欄位部分必須由前端來做第一步的驗證, 例如: 必填欄位未填寫, 資料格式錯誤, ... 等.

hsieh-sunghai commented 5 years ago

剛在表格中將前端明顯是應由表單驗證的錯誤加上 FV。 表格中沒有資訊的項目如果是前端必須回應使用者的情況，目前就提示使用者可以回報給系統管理員。

也針對 @kelp404 的建議開了一個下階段的待辦事項。

"回報給系統管理員"是指連結到"聯絡我們"的那個頁面嗎?

ghost commented 5 years ago

"回報給系統管理員"是指連結到"聯絡我們"的那個頁面嗎?

是的。

oahehc commented 5 years ago

前端做表單驗證, 也還是需要定義 API error 時要顯示給 user 的訊息, 最少要 by status 提供對應資訊, 類似以下：

  switch (status) {
    case '400':
      return '操作失敗，資料內容有誤。';
    case '401':
      return '操作失敗，請先登入。';
    case '403':
      return '操作失敗，您的帳號無權限操作此步驟';
    default:
      return '操作失敗，請再試一次';
  }
ghost commented 5 years ago

https://github.com/TaiBIF/camera-trap-api/issues/168#issuecomment-495645850

hsieh-sunghai commented 5 years ago

持續整理後端所回傳的錯誤訊息, 已針對 handler/file-handler.js 檔案進行了更新及補充, 其中 Frontend 一欄標註 WR (wait for reviewing) 的訊息內容, 需要請 @cjk-halodule 協助 review. https://github.com/TaiBIF/camera-trap-api/wiki/Status-Code-and-Error-Code

moogoo78 commented 5 years ago

要處理，如果同一個 CSV 檔案，遇到資料中有不同相機位置時，需要回傳讓使用者能了解的錯誤訊息

hsieh-sunghai commented 5 years ago

交接事項: