Command Palette

Search for a command to run...

Hectal
Phase 1: Calling a Model over HTTP
AI Frontend · Exercise 4 of 6 PreviousNext
Intermediate

Friendly Errors

The route fails in a different way each time you click #ask: a 429 (with Retry-After: 5), a 500, a 401 whose body contains a made-up key, a 502 whose body is an HTML page, and finally a success. Right now the page prints whatever text the server sent.

Fix the click handler. On failure, leave #answer empty and show only these messages in #error. 429: Mitra is busy. Try again in 5 seconds. (take the 5 from the Retry-After header). 401: Mitra is not set up correctly. The shop has been told. 500 and 502: Mitra had a problem on its side. Please try again. On success, show answer from the JSON in #answer and clear #error. The HTML page from the 502 must not crash your code.

What Check tests

  1. A 429 with Retry-After: 5 shows Mitra is busy. Try again in 5 seconds. and no answer
  2. A 500 shows Mitra had a problem on its side. Please try again.
  3. A 401 shows Mitra is not set up correctly. The shop has been told. and never the key
  4. A 502 with an HTML page shows the same message as a 500, without errors
  5. A success shows the answer and clears #error

Stuck? One hint at a time

The solution unlocks after your first Check. Try first: that is where the learning happens.

Runs in your browser. Your code is saved here.

Your page

Press Run to see the page.

Console

Nothing logged yet.