Потпуни пресретање AJAX грешака у JavaScript-у

Промис који враћа fetch, завршава се грешком само ако је дошао до мрежне грешке. Ако сервер врати одговор са статусом 404 или 500, онда ће промис бити успешно завршен, али ће статус ok бити постављен на false.

Хајде да пресретнемо обе врсте грешака:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				console.log('лош статус одговора');
				return '';
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Урадимо да се грешка, повезана са лошим HTTP статусом одговора, такође хвата у блоку catch. За то ћемо је проследити даље преко throw:

button.addEventListener('click', function() {
	let promise = fetch('/ajax.html')
	.then(
		response => {
			if (response.ok) {
				return response.text();
			} else {
				throw new Error('лош статус одговора');
			}
		},
	).then(
		text => {
			console.log(text);
		}
	).catch(
		error => {
			console.log(error);
		}
	);
});

Прикажите текст странице ако је захтев био успешан, и грешку ако је нешто пошло наопако.