Pilnīga AJAX kļūdu pārtveršana JavaScript

Promise, ko atgriež fetch, tiek izpildīts ar kļūdu tikai tad, ja ir radusies tīkla kļūda. Ja serveris atgriež atbildi ar statusu 404 vai 500, tad promise tiks izpildīts veiksmīgi, bet statusa ok vērtība būs iestatīta uz false.

Pārtversim abus kļūdu veidus:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				console.log('slikts atbildes statuss');
				return '';
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Panāksim, ka kļūda, kas saistīta ar sliktu HTTP atbildes statusu, arī tiktu noķerta catch blokā. Lai to izdarītu, izmestsim to tālāk izmantojot throw:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				throw new Error('slikts atbildes statuss');
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Izvadiet lapas tekstu, ja pieprasījums bija veiksmīgs, un kļūdu, ja kaut kas nogāja greizi.