Pemintasan Penuh Ralat AJAX dalam JavaScript

Janji (Promise) yang dikembalikan oleh fetch, hanya akan diselesaikan dengan ralat jika berlakunya ralat rangkaian. Jika pelayan mengembalikan respons dengan status 404 atau 500, maka janji akan diselesaikan dengan berjaya, tetapi status ok akan disetkan kepada false.

Mari kita pintas kedua-dua jenis ralat:

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

Mari kita pastikan ralat yang berkaitan dengan status HTTP yang tidak baik juga dapat ditangkap oleh blok catch. Untuk melakukan ini, lontarkan (throw) ralat tersebut melalui throw:

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

Tunjukkan teks halaman jika permintaan berjaya, dan ralat jika berlaku sesuatu masalah.