Ինչպես է տեղի ունենում նույնականացման գործընթացը?

Օգտագործողի նույնականացման գործընթացը ֆրոնտենդ-հավելվածում ընդհանուր տեսքով բաղկացած է հետևյալ քայլերից:

1. Մուտքագրել տվյալներ: Օգտագործողը մուտքագրում է մուտքագրում և գաղտնաբառը կայքի կամ հավելվածի ձևում:
2. Ուղարկել տվյալները սերվերին: Ֆրոնտենդը ուղարկում է այդ տվյալները սերվերին (բեքենդ) HTTP-հարցումով (հաճախ POST) հատուկ նույնականացման վերջնակետին: Տվյալները կարող են ուղարկվել JSON կամ FormData ձևաչափով հարցման մարմնում:
3. Տվյալների ստուգում սերվերում: Բեքենդը ստանում է տվյալները, ստուգում է դրանց առկայությունը իր տվյալների բազայում (օրինակ, արդյոք մուտքագրած անունը համապատասխանում է առկա օգտվողին և արդյոք մուտքագրված գաղտնաբառի հեշը համընկնում է բազայի հեշի հետ):
4. Թոքեն/սեսիայի ստեղծում: Եթե տվյալները ճիշտ են, սերվերը ստեղծում է յուրահատուկ նույնականացման նշան: Դա կարող է լինել՝
   • Սեսիայի ID: Սերվերը ստեղծում է սեսիա և կապում այն օգտվողի հետ, ուղարկելով հաճախորդին սեսիայի նույնականիչ (օրինակ, HttpOnly նշանով կուկի):
   • Թոքեն (օրինակ, JWT): Սերվերը ստեղծում է թոքեն, որը պարունակում է օգտվողի և նրա իրավունքների մասին տեղեկություններ, ստորագրելով այն իր գաղտնի բանալով: Այս թոքենը ուղարկվում է հաճախորդին:
5. Թոքենի/սեսիայի ուղարկում հաճախորդին: Սերվերը պատասխանում է ֆրոնտենդին, ուղարկելով ստեղծված նույնականացման նշանը:
   • Եթե օգտագործվում է սեսիայի ID, այն սովորաբար փոխանցվում է Set-Cookie HTTP-հետագծով:
   • Եթե օգտագործվում է թոքեն, այն կարող է փոխանցվել պատասխան մարմնում (JSON) կամ Authorization հղումում (օրինակ, Bearer <թոքեն>):
6. Նշանի պահպանում հաճախորդի կողմից: Ֆրոնտենդը ստանում է նշանը և պահպանում այն հետագա հարցումների համար:
   • Սեսիայի ID-ն պահվում է բրաուզերում կուկի մեջ (ավտոմատ)
   • Թոքենը կարող է պահվել localStorage, sessionStorage կամ կուկի մեջ (HttpOnly նշանով՝ XSS-ից պաշտպանվելու համար): Առավել անվտանգ է օգտագործել HttpOnly կուկի թոքենների համար:
7. Նշանի օգտագործում պաշտպանված հարցումների համար: Երբ կատարվում են հետագա հարցումներ պաշտպանված ռեսուրսներին, ֆրոնտենդը ուղարկում է պահպարված նշանը յուրաքանչյուր հարցման մեջ:
   • Բրաուզերը ինքնաբերաբար ուղարկում է համապատասխան կուկիները՝ սեսիայի ID-ի համար:
   • Թոքենների դեպքում ֆրոնտենդը պետք է հստակ ավելացնի թոքենը Authorization հղումում:
8. Նշանի ստուգում սերվերում: Յուրաքանչյուր պաշտպանված ռեսուրսի հարցման ժամանակ, սերվերը ստանում է նշանը և ստուգում նրա օրինականությունը (օրինակ, ժամկետի ավարտ, ստորագրություն, սեսիայի առկայություն):
9. Անվտանգություն: Եթե նշանը վավեր է, սերվերը որոշում է օգտվողին և ստուգում նրա իրավունքները:
10. Հարցի կատարմամբ: Եթե օգտվողը նույնականացված և իրավունք ունի, սերվերը կատարում է հարցումը և ուղարկում պատասխան, հակառակ դեպքում՝ սխալ հաղորդագրություն:

Նույնականացման սխեմաները տարբեր են (սեսիաներ, JWT, OAuth2, OpenID Connect և այլն), բայց հիմնական քայլերը նույնականացման նշանի ստացման և օգտագործման համար նույնն են:

Նմուշ՝ տվյալների ուղարկում սերվերին (fetch API և թոքեն օգտագործելով):

// Օգտագործողի տվյալներ
const userData = {
  username: 'user123',
  password: 'securepassword'
};

// Ուղարկել տվյալները սերվերին
fetch('/api/login', { // նույնականացման վերջնակետ
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(userData)
})
.then(response => {
  if (!response.ok) {
    throw new Error('Login failed');
  }
  return response.json(); // սպասում ենք, որ սերվերը վերադարձնի JSON թոքեն
})
.then(data => {
  const authToken = data.token; // ստանում ենք թոքենը պատասխանից
  localStorage.setItem('authToken', authToken); // պահպանում ենք թոքենը
  console.log('Login successful, token saved.');
  // օգտվողին ուղղորդել պաշտպանված էջ
})
.catch(error => {
  console.error('Authentication error:', error);
  // ցույց տալ սխալի հաղորդագրություն
});

// Պաշտպանված հարցում թոքենով
const token = localStorage.getItem('authToken');
if (token) {
  fetch('/api/protected-resource', {
    method: 'GET',
    headers: {
      'Authorization': `Bearer ${token}` // ավելացնել թոքենը Authorization հղում
    }
  })
  .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';
}

Բարձր անվտանգության նկատառումներով:

• Օգտագործել միայն HTTPS
• Պահել նշանները անվտանգ
• Օգտագործել կարճաժամկետ թոքեններ
• Վալիդացնել տվյալները սերվերում