பெறுதல் (உருவகப்படுத்தப்பட்டது)

உண்மையான பக்கத்தில், fetch(url) ஒரு சேவையகத்தை அழைக்கிறது. இங்கே கற்றல் உலாவியில் நம்மால் முடியாது வெளிப்புற சேவையகங்களுடன் பேசுங்கள், எனவே நாங்கள் "போலி" fetch ஐப் பயன்படுத்துவோம்: சோதனைகளில், ஒரு globalThis.fetch உட்செலுத்தப்பட்டது இது முன் வரையறுக்கப்பட்ட தரவை வழங்குகிறது, எனவே நீங்கள் பயிற்சி செய்யலாம் நெட்வொர்க் சார்ந்து இல்லாமல் தர்க்கம்.

நீங்கள் விரும்பும் API உண்மையானது போலவே உள்ளது:

const response = await fetch('/api/utenti');
const data = await response.json();

fetch(url) ஒரு Response பொருளுக்குத் தீர்க்கப்பட்ட வாக்குறுதியை வழங்குகிறது. Response.json() திரும்புகிறது இதையொட்டி பாகுபடுத்தப்பட்ட உடலுடன் ஒரு வாக்குறுதி. எனவே உங்களுக்கு இரண்டு காத்திருக்க வேண்டும்.

முழுமையான உதாரணம்

async function loadUsers() {
  const response = await fetch('/api/utenti');
  const users = await response.json();
  return users;
}

const list = await loadUsers();
// [{...}, {...}]

வெற்றி பெற்றதா எனச் சரிபார்க்கிறது

fetch சர்வர் பிழை நிலையுடன் பதிலளித்தால் எறியாது (404, 500). அது இன்னும் உங்களுக்கு அளிக்கிறது ஒரு Response, ஆனால் ok: false உடன்:

const r = await fetch('/api/utenti');
if (!r.ok) {
  throw new Error(`HTTP ${r.status}`);
}
const data = await r.json();

fetch நெட்வொர்க் தோல்வியுற்றால் மட்டுமே வீசும் (இணைப்பு இல்லை, DNS, ...).

இணையாக பல கோரிக்கைகள்: Promise.all

நீங்கள் N சுதந்திரமான அழைப்புகளைச் செய்ய வேண்டுமானால், அவற்றை ஒன்றாகத் தொடங்கி, Promise.all உடன் காத்திருக்கவும்:

const [u, p] = await Promise.all([
  fetch('/api/utenti').then((r) => r.json()),
  fetch('/api/prodotti').then((r) => r.json()),
]);

தொடர்ச்சியாக இரண்டு awaits உடன் இது கிட்டத்தட்ட இரண்டு மடங்கு நேரம் எடுக்கும் (தொகை); இணையாக அது இரண்டில் அதிகபட்சம் (மெதுவானது).

முயற்சி செய்து பாருங்கள்

மதிப்பாய்வு பயிற்சி