Sobes.tech
Junior

Kuidas toimub autentimise protsess?

sobes.tech AI

Vastus AI-lt

Kasutaja autentimisprotsess frontend rakenduses koosneb üldiselt järgmistest sammudest:

  1. Andmete päring: Kasutaja sisestab sisselogimisnime ja parooli veebilehe või rakenduse vormis.
  2. Andmete saatmine serverile: Frontend saadab need andmed serverile (backend) HTTP-päringuga (tavaliselt POST) spetsiaalsele autentimise lõpp-punktile. Andmed võivad olla saadetud JSON või FormData formaadis.
  3. Andmete kontroll serveris: Backend saab andmed, kontrollib nende olemasolu oma andmebaasis (näiteks, kas sisselogimisnimi vastab olemasolevale kasutajale ja kas sisestatud parooli hash vastab andmebaasis olevale hashile).
  4. Tõendi/ sessiooni loomine: Kui andmed on õiged, genereerib server unikaalse autentimärgi. See võib olla:
    • Sessiooni ID: server loob sessiooni ja seob selle kasutajaga, saates kliendile sessiooni identifikaatori (näiteks HttpOnly küpsisega).
    • Tõend (näiteks JWT): server genereerib tõendi, mis sisaldab teavet kasutaja ja tema õiguste kohta, allkirjastades selle oma salajase võtmega. See tõend saadetakse kliendile.
  5. Tõendi/sessiooni saatmine kliendile: Server vastab frontendile, saates genereeritud autentimärgi:
    • Kui kasutatakse sessiooni ID-d, tavaliselt edastatakse see Set-Cookie päises.
    • Kui kasutatakse tõendit, võib see olla saadetud vastuse kehas (JSON) või Authorization päises (Bearer <tõend>).
  6. Märgi salvestamine kliendi poolel: Frontend saab märgi ja salvestab selle edasisteks päringuteks:
    • Sessiooni ID salvestatakse brauseri küpsises (automaatne)
    • Tõend võib olla salvestatud localStorage, sessionStorage või küpsises (HttpOnly märgisega, XSS kaitseks). Turvalisem on kasutada HttpOnly küpsiseid.
  7. Märgi kasutamine kaitstud päringutes: Tehes järgmisi päringuid kaitstud ressurssidele, frontend saadab salvestatud märgi iga päringuga:
    • Brauser saadab automaatselt vastavad küpsised sessiooni ID-ga.
    • Tõendi puhul peab frontend selgelt lisama tõendi Authorization päises (Bearer <tõend>).
  8. Märgi kontroll serveris: Iga päringu puhul server võtab märgi ja kontrollib selle kehtivust (näiteks, kehtivusaeg, allkiri, sessiooni olemasolu).
  9. Autentimine ja autoriseerimine: Kui märgis on kehtiv, määrab server kasutaja, kellele see kuulub, ja kontrollib tema õigusi nõutavale ressursile.
  10. Päringut teostatakse: Kui kasutaja on autentitud ja tal on õigused, täidab server päringu ja saadab vastuse. Muul juhul saadab server vea (401 Unauthorized või 403 Forbidden).

Autentimisskeemid võivad olla erinevad (sessioonid, JWT, OAuth2, OpenID Connect jne), kuid põhisammud jäävad sarnaseks.

Näide andmete saatmisest serverile (fetch API ja tõendiga):

// Kasutaja andmed
const userData = {
  username: 'user123',
  password: 'securepassword'
};

// Andmete saatmine serverile
fetch('/api/login', { // autentimise lõpp-punkt
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(userData)
})
.then(response => {
  if (!response.ok) {
    throw new Error('Login failed');
  }
  return response.json(); // ootame, et server tagastab JSON-tõendi
})
.then(data => {
  const authToken = data.token; // saame tõendi vastusest
  localStorage.setItem('authToken', authToken); // salvestame tõendi
  console.log('Login successful, token saved.');
  // kasutaja suunamine kaitstud lehele
})
.catch(error => {
  console.error('Authentication error:', error);
  // näidata veateadet kasutajale
});

// Kaitstud päring tõendiga
const token = localStorage.getItem('authToken');
if (token) {
  fetch('/api/protected-resource', {
    method: 'GET',
    headers: {
      'Authorization': `Bearer ${token}` // tõendi lisamine Authorization päises
    }
  })
  .then(response => {
    if (!response.ok) {
      if (response.status === 401) {
        console.log('Token expired or invalid. Redirecting to login.');
        localStorage.removeItem('authToken');
        // window.location.href = '/login';
      }
      throw new Error('Failed to fetch protected resource');
    }
    return response.json();
  })
  .then(data => {
    console.log('Protected data:', data);
  })
  .catch(error => {
    console.error('Error fetching protected resource:', error);
  });
} else {
  console.log('No auth token found. Redirecting to login.');
  // window.location.href = '/login';
}

Võtmetähtsusega turvameetmed:

  • Kasutage HTTPS
  • Salvestage märgid turvaliselt
  • Kasutage lühiajalisi žetone
  • Serveris valideerige andmeid