API vasitəsilə məlumat dəyişmək

Yazma sorğusunu qur

JSON göndərmək üçün gövdəni JSON.stringify ilə mətnə çevir və Content-Type başlığını uyğun yaz. Aşağıdakı nümunə JSONPlaceholder test xidmətindən istifadə edir. Bu xidmət yazmanı təqlid edir; qaytarılan nəticə məlumatın daimi saxlandığını bildirmir.

async function request(path, method, data) {
  const response = await fetch(`https://jsonplaceholder.typicode.com${path}`, {
    method,
    headers: { 'Content-Type': 'application/json' },
    ...(data === undefined ? {} : { body: JSON.stringify(data) })
  });
  if (!response.ok) throw new Error(`HTTP ${response.status}`);
  if (response.status === 204) return null;
  const text = await response.text();
  return text ? JSON.parse(text) : null;
}
const created = await request('/posts', 'POST', {
  title: 'İlk qeyd', body: 'Təlim məzmunu', userId: 1
});
await request('/posts/1', 'PUT', {
  id: 1, title: 'Yenilənmiş qeyd', body: 'Yeni mətn', userId: 1
});
await request('/posts/1', 'DELETE');
console.log(created);

Nümunə

Kod ES modulunda və ya async funksiya daxilində çağırılır. POST adətən yaradır, PUT tam təqdimatı yeniləyir; qismən dəyişiklik üçün bəzi API-lər PATCH təqdim edir. Müqaviləni sənəddən yoxla.

Token və istifadəçi vəziyyəti

Bəzi xidmətlər əvvəl giriş sorğusundan token verir və onu sonrakı sorğularda tələb edir. Başlıq formatını sənəddən götür. Özəl server açarını brauzerə göndərmə; başqa materialdakı nümunə tokeni kopyalama. Sorğu gedərkən təkrar submit-i məhdudlaşdır, uğurdan sonra interfeysi server nəticəsinə əsasən yenilə, xətada istifadəçinin girişini saxla.

Əlavə qeydlər və mənbələr

POST ilə yaratma, PUT ilə yeniləmə və DELETE ilə silmə sorğularını ayır. JSON gövdəsi və Content-Type başlığını göndər; autentifikasiya tokeninin necə ötürüldüyünü sənəddən yoxla, gizli açarı brauzer koduna yazma.

Niyə vacibdir?

API tətbiqlərin bir-biri ilə məlumat mübadiləsi aparması üçün razılaşdırılmış interfeysdir.

Əvvəlki biliklər

DOM və brauzer hadisələri

Bu mövzuda

POST, PUT və DELETE
headers, body və JSON
Token və encodeURIComponent

Mövzuya baxış

Mənbələr

Məşqin idarəetməsi

Addım 1 / 2

Yeni qeyd yarat

Metodu seç, JSON gövdəsini hazırla və uğurlu cavabı emal et.

Prosesi son vəziyyətə çatdır.

Yeni qeyd lazımdır
GET yalnız oxuyur
POST seçildi
JSON hazırdır
201 cavabı

Yeni qeyd lazımdır

Oxumaq yox, məlumat yaratmaq istəyirsən.

/posts

Bu məşq prosesi modelləşdirir.

Özün sına

Lokal və ya sınaq API-də qeyd yarat, yenilə və sil. Statusu yoxla; DELETE üçün boş cavabı JSON kimi oxuma. Yalnız sınaq məlumatı istifadə et.

Nəticəni necə yoxlayım?

POST, PUT və DELETE düzgün metodla göndərilir; status yoxlanılır və 204 cavabında JSON oxunmur.

Gözlənilən nəticə

Network-də POST, PUT, DELETE metodları və uyğun gövdələr görünür.
204 və ya boş gövdə null olur; qeyri-uğurlu status xətaya çevrilir.

Nümunə həllə bax

Əvvəl özün sına, sonra müqayisə et. Bu, mümkün həllərdən biridir.

Yalnız sınaq API-sinə yazılır; bu xidmətin cavabı daimi saxlanma vədi deyil. Boş DELETE gövdəsi JSON kimi oxunmur.

main.js

async function request(path, method, data) {
  const response = await fetch(`https://jsonplaceholder.typicode.com${path}`, {
    method, headers: { 'Content-Type': 'application/json' },
    ...(data === undefined ? {} : { body: JSON.stringify(data) })
  });
  if (!response.ok) throw new Error(`HTTP ${response.status}`);
  if (response.status === 204) return null;
  const text = await response.text();
  return text ? JSON.parse(text) : null;
}
async function run() {
  console.log(await request('/posts', 'POST', { title: 'Təlim', body: 'Nümunə', userId: 1 }));
  console.log(await request('/posts/1', 'PUT', { id: 1, title: 'Yeni', body: 'Nümunə', userId: 1 }));
  console.log(await request('/posts/1', 'DELETE'));
}
run().catch(error => console.error(error.message));

Praktikanı bitirdin?Özün qiymətləndirirsən. İrəliləyiş bu brauzerdə saxlanılır.