জাভাস্ক্রিপ্টে AJAX ত্রুটির সম্পূর্ণ ইন্টারসেপশন

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);
		}
	);
});

catch ব্লক দ্বারা HTTP রেসপন্সের খারাপ স্ট্যাটাস সংক্রান্ত ত্রুটিও ক্যাচ করা যায় তা নিশ্চিত করা যাক। এটি করার জন্য, 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);
		}
	);
});

যদি রিকোয়েস্ট সফল হয় তাহলে পৃষ্ঠার টেক্সট আউটপুট করুন, এবং যদি কিছু ভুল হয়ে যায় তাহলে ত্রুটি আউটপুট করুন।