HTTP: metode, statusuri, headere
Limba dintre browser și server, cache-ul HTTP și ce înseamnă idempotent.
Actualizat
Ce este HTTP
HTTP e limba în care vorbesc browserul și serverul. Un mesaj HTTP e text cu trei părți: o linie de start, headere (metadate) și, opțional, un body (conținut).
GET /api/posts?page=2 HTTP/1.1 ← metodă + cale
Host: learn-js.vercel.app ← headere
Accept: application/json
Cookie: vid=9e88...
HTTP/1.1 200 OK ← status
Content-Type: application/json
Cache-Control: max-age=60
[{"id":1,"title":"Salut"}] ← body
HTTP e stateless — fiecare request e independent; serverul nu „ține minte” nimic între ele. De-asta există cookie-urile.
Metode
| Metodă | Rol | Are body | Idempotent |
|---|---|---|---|
GET |
citește | nu | da |
POST |
creează / trimite o acțiune | da | nu |
PUT |
înlocuiește complet | da | da |
PATCH |
modifică parțial | da | de obicei nu |
DELETE |
șterge | rar | da |
Idempotent = dacă repeți request-ul de 5 ori, rezultatul e același ca după unul. GET nu trebuie să modifice niciodată date — browserele și crawler-ele îl pot repeta oricând.
Coduri de status
| Clasă | Înseamnă | Cele mai folosite |
|---|---|---|
2xx |
succes | 200 OK, 201 Created, 204 No Content |
3xx |
redirect | 301 permanent, 302/307 temporar, 304 Not Modified |
4xx |
greșeala clientului | 400 date invalide, 401 neautentificat, 403 interzis, 404 lipsă, 429 prea multe cereri |
5xx |
greșeala serverului | 500 eroare internă, 502/503 serviciu indisponibil |
Diferența 401 vs 403: 401 = „nu știu cine ești”, 403 = „știu cine ești, dar nu ai voie”.
Headere importante
| Header | Direcție | Rol |
|---|---|---|
Content-Type |
ambele | formatul body-ului: application/json, text/html |
Authorization |
request | token de acces |
Cookie / Set-Cookie |
req / res | cookie-uri |
Cache-Control |
response | cât timp se poate păstra în cache |
Location |
response | unde redirecționează un 3xx |
Cache HTTP
Cache-Control spune browserului și CDN-ului cât timp pot refolosi răspunsul fără să-l mai ceară:
| Valoare | Efect |
|---|---|
max-age=3600 |
proaspăt 1 oră |
no-cache |
poate fi păstrat, dar verifică la server înainte de folosire |
no-store |
nu păstra deloc (date sensibile) |
public / private |
poate fi păstrat de CDN / doar de browser |
stale-while-revalidate=60 |
servește varianta veche, reîmprospătează în fundal |
Ultimul e exact ideea din spatele revalidateTag(tag, 'max') din Next.
HTTP/1.1, HTTP/2, HTTP/3
Aceeași semantică (metode, statusuri, headere), transport mai eficient: HTTP/2 trimite multe fișiere pe o singură conexiune; HTTP/3 merge peste QUIC (mai bun pe rețele mobile). Pentru tine, ca frontender, codul rămâne identic.
Greșeli frecvente
- Să modifici date cu
GET(link-uri de tip/delete?id=5). - Să returnezi
200cu{ error: '...' }în loc de status corect. - Să cache-uiești răspunsuri private (
publicpe date de user).
Pe scurt
- Request = metodă + URL + headere + body; response = status + headere + body.
- GET citește, POST creează, PUT/PATCH modifică, DELETE șterge.
- 4xx = vina clientului, 5xx = vina serverului.
Cache-Controldecide cât trăiește un răspuns în cache.