首頁 > web前端 > js教程 > 以客戶端為中心的錯誤處理

以客戶端為中心的錯誤處理

DDD
發布: 2024-09-13 10:30:32
原創
1284 人瀏覽過

Client-Centered Error Handling

了解並處理錯誤

為了有效地處理錯誤,必須了解可能發生的錯誤類型。讓我們先對您可能遇到的錯誤進行分類。

Web 用戶端環境中的錯誤類型

網路錯誤

  • 連線問題:與伺服器建立連線時出現問題。
  • 超時:請求花費太長時間才能收到回應。
  • DNS 錯誤:網域名稱解析問題。
  • HTTP 錯誤:404 Not Found、500 Internal Server Error 等錯誤

伺服器 API 錯誤

  • 無效回應:來自伺服器的意外或格式錯誤的資料。
  • 身份驗證錯誤:使用者身份驗證或授權問題。
  • 速率限制:由於超出 API 使用限製而產生的限制。

使用者瀏覽器環境錯誤

  • 瀏覽器相容性:由於瀏覽器處理某些功能的方式不同而產生的問題。
  • JavaScript 錯誤:客戶端 JavaScript 程式碼中的錯誤。
  • 資源載入錯誤:載入圖片、腳本或樣式表等資源時出現問題。

其他錯誤

  • 客戶端錯誤:與使用者裝置或作業系統相關的錯誤。
  • UI/UX 錯誤:使用者介面或使用者體驗問題,例如連結損壞或佈局不正確。

可能會發生各種類型的錯誤。然而,這些錯誤通常可以分為兩類:

  1. 預期錯誤:事先知道發生狀況和性質的錯誤。
  2. 意外錯誤:事先不知道其發生和性質的錯誤。

讓我們將討論過的錯誤分為這些類別。

錯誤是否可以預見?

預期錯誤

從具有明確狀態代碼的伺服器 API 收到的錯誤可以被視為預期錯誤,因為它們可以提前預測和解決。

例如未授權存取(401)或禁止存取(403)等錯誤,可根據情況進行適當處理。為每個狀態代碼定義更詳細的錯誤代碼以管理回應錯誤的應用程式邏輯也很常見。這些被稱為預期錯誤。

意外錯誤

另一方面,500 範圍內的伺服器錯誤被歸類為 意外錯誤,因為它們是不可預測的。伺服器因任何原因無法回應的情況隨時可能發生。此外,由於使用者的網路環境或瀏覽器環境而可能出現的錯誤難以預測,因此被歸類為意外錯誤。

使用者和錯誤

錯誤還可以根據與使用者的互動進行分類,而不僅僅是環境。對錯誤進行分類的一種方法是考慮使用者是否可以對錯誤採取措施。以下是此分類的標準:

  1. 使用者可以理解和解決的錯誤(幫助使用者繼續使用應用程式的錯誤)。
  2. 使用者無法解決的錯誤(無法提供使用者任何幫助的錯誤)。

可解決的錯誤

例如,身分驗證或授權錯誤就屬於此類。未登入的使用者可能會遇到 401 狀態錯誤。在這種情況下,您可以提供登入畫面或顯示一則訊息,指示需要登入。

如果使用者沒有存取特定螢幕的權限,您可以引導他們向管理員要求存取權限。

沒有一個產品開發者會歡迎使用者放棄。為遇到錯誤的用戶提供指導以幫助他們克服這種情況至關重要。例如,為臨時網路錯誤提供刷新按鈕,或在存取不存在的頁面時提供返回上一畫面的按鈕。

無法解決的錯誤

但是,在某些情況下,通知使用者錯誤情況根本沒有幫助。例如,如果程式碼包含無法在低規格設備或瀏覽器上運行的元件,則使用者無法對其執行任何操作。 (也許是一條建議使用不同瀏覽器的訊息?)

兩種情況,1 和 2,都涉及提供訊息。不同之處在於,案例 1 包含一些提示使用者採取步驟的操作或指導。

遇到的錯誤是否是使用者可以自行解決的?

如何處理錯誤

那麼,我們該如何處理發生的錯誤呢?當發生錯誤時應用程式應該向用戶提供什麼樣的介面?讓我們根據錯誤的特徵來探討如何處理不同類型的錯誤。

不可預測但可解決的錯誤

一個典型的例子是網路錯誤。這些可能隨時發生,具體取決於使用者的網路環境。最簡單的解決方案是通知用戶這是一個“臨時錯誤”,並提供重試之前操作的指導。

誤差範圍

對於這些錯誤,確保整個應用程式不會受到不利影響至關重要。例如,如果一個應用程式在一個畫面上呼叫 10 個 API,則失敗的一個 API 不應在整個應用程式中觸發錯誤訊息,並且需要重試所有呼叫。

相反,只專注於恢復失敗的區域。

不可預測且無法解決的錯誤

這些錯誤很難預測且沒有直接的解決方案。在開發過程中應該盡量減少此類錯誤,並且應該有一個在發生錯誤時進行處理的計劃。由於用戶無法自行解決這些錯誤,因此可能有必要提供一種簡單的方式來聯絡客戶支援。

監控

開發人員無法控制的錯誤應使用 Sentry 等工具進行監控。需要修復這些錯誤以防止用戶遇到它們。此外,確保有一種機制可以讓用戶在遇到此類錯誤時返回應用程式。

可預測但無法解決的錯誤

這些是已知錯誤,使用者沒有可用的解決方案。如果使用者無法自行解決這些問題,則表示錯過了錯誤處理的機會。如果使用者故意執行異常操作,則可能是存在安全漏洞的跡象。

與安全相關的錯誤

當有惡意利用該應用程式時,就會出現這些錯誤。它們通常源自於安全漏洞,應該在開發過程中加以預防。解決 CORS 和 XSS 等基本安全問題並與安全團隊合作建立安全的應用程式至關重要。

可預測和可解決的錯誤

這些錯誤通常是開發人員已經意識到的業務邏輯的一部分:

  • 401 未經授權錯誤:需要登入。
  • 404 Not Found 錯誤:存取錯誤的頁面。
  • 其他業務邏輯錯誤:由應用程式的邏輯定義。

在這些情況下,請在應用程式內提供適當的指導或建立單獨的頁面來指導使用者。

指導的重要性

使用者應該清楚了解遇到錯誤訊息後下一步該做什麼。這有助於減少錯誤頻率並防止用戶放棄。因此,除了錯誤訊息之外,還必須包含號召性用語。

例如,如果存在欄位驗證錯誤,請注意發生錯誤的欄位。如果使用者導航到不存在的頁面,請提供一個返回上一畫面的按鈕。

結論

Client-Centered Error Handling

我們探索了錯誤處理。讓我們利用各種工具和技術來有效地管理錯誤,例如錯誤監控工具和React的ErrorBoundary,它可以捕捉有限範圍內的錯誤。

以上是以客戶端為中心的錯誤處理的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板