Interceptarea completă a erorilor AJAX în JavaScript

Promisiunea returnată de fetch se finalizează cu o eroare doar dacă a apărut o eroare de rețea. Dacă serverul a returnat un răspuns cu statusul 404 sau 500, atunci promisiunea va fi finalizată cu succes, dar în acest caz statusul ok va fi setat la false.

Să interceptăm ambele tipuri de erori:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				console.log('statusul răspunsului este nefavorabil');
				return '';
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Să facem în așa fel încât eroarea, legată de statusul HTTP nefavorabil al răspunsului, de asemenea să fie prinsă de blocul catch. Pentru aceasta să o transmitem mai departe prin throw:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				throw new Error('statusul răspunsului este nefavorabil');
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Afișați textul paginii, dacă cererea a fost efectuată cu succes, și eroarea, dacă ceva n-a mers bine.