Zabrałam się do pracy nad aplikacją i nagle zobaczyłam, że dodawanie nowej gry nie działa poprawnie – a raczej nie działa w ogóle. Wszystko pięknie, naprawi się w przyszłości, ale czemu nie mam żadnej informacji po stronie klienta, że coś poszło nie tak? Musiałam zabrać się więc za obsługę błędów.

Załóżmy kilka przypadków błędów po stronie serwera:

 niezidentyfikowany błąd (np. brak połączenia z bazą danych),

 zidentyfikowany błąd (np. brak obiektu o danym id).

W każdym z tych przypadków chciałabym, żeby użytkownik dostał informację zwrotną o tym, co poszło nie tak.

Po stronie serwera metoda obsługująca dodanie nowej gry wygląda następująco:

<br>
[HttpPost]<br>
public JsonResult Add(string name)<br>
{<br>
    int boardGameId = BoardGameGeekIntegration.BGGBoardGame.GetBoardGameId(name);<br>
    if (boardGameId != 0)<br>
    {<br>
       BoardGame boardGame = BoardGameGeekIntegration.BGGBoardGame.GetBoardGameById(boardGameId);<br>
       boardGame.Id = boardGameService.GetAll().Select(x =&gt; x.Id).LastOrDefault() + 1;<br>
       boardGameService.Add(boardGame);<br>
       return Json(null, JsonRequestBehavior.AllowGet);<br>
    }<br>
    return Json("Nie znaleziono gry o nazwie " + name, JsonRequestBehavior.AllowGet);<br>
}<br>

Widać, że w przypadku nieznalezienia Id dla danej gry (boardGameId) w serwisie BoardGameGeek (z którego pobieramy informacje), logika pobierająca szczegóły tej gry nie zostanie wywołana i zostanie zwrócony Json z informacją o nie odnalezieniu gry o danej nazwie.

Sprawdźmy jak to może wyglądać po stronie użytkownika. Podajemy nazwę gry:

I klikamy przycisk Dodaj. Otrzymujemy komunikat:

Wiadomo więc, co się stało i dlaczego gra nie została dodana.

A co w przypadku jakiegoś niezidetyfikowanego błędu po stronie serwera?

Dla moich aktualnych potrzeb takie informacje wystarczają. Oczywiście obsługa błędów dla rzeczywistych użytkowników będzie musiała być bardziej dopracowana, ale na początek zaczynamy od tego.

Zobaczmy, jak to wygląda po stronie frontendu. Utworzyłam plik common.ts, w którym zawarłam metody dostępne dla wszystkich komponentów:

<br>
import { Location } from '@angular/common';</p>
<p>export class Common {<br>
   constructor(<br>
      private location?: Location<br>
   ) { }</p>
<p>   goBack(): void {<br>
      this.location.back();<br>
   }</p>
<p>   showErrorOrGoBack(errorMessage): void {<br>
      if (errorMessage !== "") {<br>
         alert(errorMessage);<br>
         return;<br>
      }<br>
      else {<br>
         return this.goBack();<br>
      }<br>
   }</p>
<p>   handleError(error: any, message?: any): Promise&lt;string&gt; {<br>
      let errorDetails: string = error.message !== "" ? error.message : "";<br>
      if (error !== "Error") {<br>
message += error;<br>
}<br>
      else if (typeof error.message != "undefined" &amp;&amp; error.message !== "") {<br>
message += errorDetails;<br>
}<br>
      else {<br>
         message = "Wystąpił nieznany błąd";<br>
      }<br>
      return message;<br>
   }<br>
}<br>

Jest więc tu metoda goBack() powrotu do poprzedniej strony, metoda showErrorOrGoBack() obsługująca błąd lub wracająca do poprzedniej lokalizacji, oraz metoda handleError() definiująca wyświetlany komunikat o błędzie.

Obsługa błędów dla przykładowej akcji dodawania nowej gry wygląda następująco:

• po stronie serwisu:

<br>
create(name: string): Promise&lt;string&gt; {<br>
   return this.http<br>
   .post(`${this._addBoardGameUrl}`, JSON.stringify(name), { headers: this.headers })<br>
   .toPromise()<br>
   .then(response =&gt; { return response.text(); })<br>
   .catch(ex =&gt; { return new Common().handleError(ex) });<br>
}<br>

• po stronie komponentu:

<br>
add(name: string): void {<br>
   var loc = this.location;<br>
   this.boardGameService.create(name)<br>
   .then(errorMessage =&gt; {<br>
      new Common(loc).showErrorOrGoBack(errorMessage);<br>
   });<br>
}<br>

Moje rozwiązanie na pewno wymaga dopracowania, ale na początek może być. Jeśli wiecie o czymś, o czym ja nie wiem (w zakresie obsługi błędów w Angularze) to zachęcam do komentowania.

Tyle na dzisiaj, bo nowa planszówka czeka, żeby w nią zagrać 😉