JavaScript-এ AJAX এর মাধ্যমে GET অনুরোধ প্রেরণ

এখন আসুন শিখি কিভাবে AJAX অনুরোধে সার্ভারে ডেটা প্রেরণ করতে হয়। সার্ভার এই ডেটা নিয়ে কিছু করবে এবং আমাদের কাছে ফলাফল ফেরত পাঠাবে।

আমাদের টেস্ট সার্ভার নিম্নলিখিত ঠিকানায় প্রেরিত ডেটা প্রক্রিয়া করবে /handler/:

button.addEventListener('click', function() {
	let promise = fetch('/handler/');
});

প্রথমে আসুন একটি GET অনুরোধ পাঠাই:

button.addEventListener('click', function() {
	let promise = fetch('/handler/?num=3');
});

আসুন সার্ভার সাইডে প্রেরিত ডেটা প্রাপ্ত করি:

export default {
	'/handler/': function({get}) {
		console.log(get.num); // আউটপুট হবে 3
	}
}

আসুন এই ডেটা নিয়ে কিছু করি এবং সেগুলো ফেরত পাঠাই:

export default {
	'/handler/': function({get}) {
		return get.num ** 2;
	}
}

ক্লায়েন্ট সাইডে ফলাফলটি পাই এবং এটি কোথাও আউটপুট করি:

button.addEventListener('click', function() {
	fetch('/handler/?num=3').then(
		response => {
			return response.text();
		}
	).then(
		text => {
			console.log(text);
		}
	);
});

ক্লায়েন্টে একটি div এবং একটি বাটন দেওয়া আছে। বাটনে ক্লিক করলে সার্ভারে দুটি সংখ্যা পাঠান। সার্ভারকে প্রেরিত সংখ্যাগুলোর যোগফল নির্ণয় করতে দিন। ফলাফল div-এ লিখুন।

সার্ভারে একটি অ্যারে দেওয়া থাকুক। সার্ভার আশা করবে যে একটি সংখ্যা প্যারামিটার হিসেবে প্রেরিত হবে, এবং সেই সংখ্যার সাথে সঙ্গতিপূর্ণ অ্যারের উপাদানটি ফেরত দেবে। একটি বাটনে ক্লিক করে সার্ভারে একটি সংখ্যা প্রেরণ করুন, এবং সার্ভারের উত্তরটি একটি অনুচ্ছেদে আউটপুট করুন।