Chặn bắt toàn bộ lỗi AJAX trong JavaScript

Promise mà <fetch trả về chỉ kết thúc với lỗi khi có lỗi mạng xảy ra. Nếu máy chủ trả về phản hồi với trạng thái <404 hoặc <500, thì promise sẽ được hoàn thành thành công, nhưng trạng thái <ok sẽ được đặt thành <false.

Hãy chặn bắt cả hai loại lỗi:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				console.log('trạng thái phản hồi không tốt');
				return '';
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Hãy làm sao để lỗi liên quan đến trạng thái HTTP không tốt cũng được bắt bởi khối <catch. Để làm điều này, chúng ta sẽ truyền nó đi xa hơn qua <throw:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				throw new Error('trạng thái phản hồi không tốt');
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Hiển thị văn bản của trang nếu yêu cầu thành công, và lỗi nếu có điều gì đó không ổn.