AJAX vigade täielik püüdmine JavaScriptis

Promise, mille tagastab fetch, lõpetatakse veaga ainult siis, kui toimus võrguviga. Kui server tagastab vastuse staatusega 404 või 500, siis Promise lõpetatakse edukalt, kuid staatus ok on seatud väärtusele false.

Püüame mõlemad veatüübid kinni:

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

Teeme nii, et viga, mis on seotud halva HTTP vastuse staatusega, püütaks ka kinni catch plokis. Selleks viskame selle edasi kasutades throw:

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

Kuva lehe tekst, kui päring oli edukas, ja viga, kui miski läks valesti.