როგორ მიმდინარეობს front-end და back-end შორის ურთიერთქმედება?

Интеракция HTTP(S) протоколы аша башкарыла һәм төрле ысуллар (GET, POST, PUT, DELETE һ.б.) кулланыла. Frontend сорауларны backendка җибәрә, мәгълүмат алу яки җибәрү өчен. Backend бу сорауларны эшкәртә, кирәк булганда мәгълүмат базасы белән аралаша һәм җавап җибәрә.

Төп аралашу ысуллары:

• REST API: Иң киң таралган ысул. Backend билгеле бер нокталар (endpoints) тәкъдим итә, аларга frontend мөрәҗәгать итә ала. Мәгълүмат гадәттә JSON форматында тапшырыла.

  // Backendтан JSON җавабы үрнәге
  {
    "users": [
      {
        "id": 1,
        "name": "Alex"
      },
      {
        "id": 2,
        "name": "Elena"
      }
    ]
  }
  

• GraphQL: RESTка альтернатива. Frontend кирәкле мәгълүматларны гына сорый, бер сорау белән. Бу сораулар санын һәм тапшырыла торган мәгълүмат күләмен киметә.

• WebSockets: Ике яклы даими тоташу урнаштырырга мөмкинлек бирә. Реаль вакытта мәгълүмат алмашу кирәк булган кушымталар өчен кулланыла (чатлар, хәбәрләр).

• Server-Sent Events (SSE): Backend frontendка мәгълүмат җибәрә, бер яктан гына, HTTP тоташуы аша. Сервердан яңартулар алу өчен кулланыла, клиенттан даими сорауларсыз.

Гомумән куллану сценарие:

1. Кулланучы frontendта берәр гамәл башкара (мәсәлән, төймәгә баса).
2. Frontend тиешле backend ноктасына HTTP соравын җибәрә.
3. Backend соравын кабул итә, эшкәртә (мәсәлән, мәгълүмат базасына сорау җибәрә).
4. Backend җавап формалаштыра (гадәттә JSON форматында) һәм аны frontendка җибәрә.
5. Frontend җавапны ала, мәгълүматны эшкәртә һәм кулланучы интерфейсын яңарта.

JavaScript кулланып frontendта AJAX соравы үрнәге:

// Кулланучылар исемлеген алу өчен GET соравы җибәрү
fetch('/api/users')
  .then(response => response.json())
  .then(data => {
    // Алынган мәгълүматны эшкәртү
    console.log('Алынган кулланучылар:', data.users);
  })
  .catch(error => {
    // Хаталарны эшкәртү
    console.error('Кулланучыларны алу вакытында хата:', error);
  });