এজেক্স - XMLHttpRequest

XMLHttpRequest অবজেক্ট সার্ভারের সঙ্গে তথ্য বিনিময় করতে ব্যবহৃত হয়。

সার্ভারে অনুরোধ পাঠানো

সার্ভারে অনুরোধ পাঠাতে, আমরা XMLHttpRequest অবজেক্টের open() এবং send() পদ্ধতি:

xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();
পদ্ধতি বর্ণনা
open(method, url, async)

অনুরোধের ধরন নির্দিষ্ট করুন

  • method：অনুরোধের ধরন: GET কিংবা POST
  • url：সার্ভার (ফাইল) অবস্থান
  • async：true（অসংযোগযোগ্য）বা false（সংযোগযোগ্য）
send() সার্ভারে অনুরোধ পাঠানো (প্রয়োজনীয় GET)
send(string) সার্ভারে অনুরোধ পাঠানো (প্রয়োজনীয় POST)

GET কিংবা POST?

GET POST-এর তুলনায় সহজ এবং দ্রুত, অধিকাংশ পরিস্থিতিতে ব্যবহার করা যেতে পারে

কিন্তু, নিম্নলিখিত পরিস্থিতিতে সবসময় POST ব্যবহার করুন:

  • ক্যাশ ফাইল বাছাই করা যায় না (সার্ভারের ফাইল বা ডাটাবেস নিয়ে নতুন করা)
  • সার্ভারে বেশি ডাটা পাঠানো (POST-এর মাত্রা নেই)
  • ব্যবহারকারীর ইনপুট পাঠানো (অজানা অক্ষরগুলিও যোগ করা যেতে পারে), POST GET-এর তুলনায় শক্তিশালী এবং নিরাপদ

GET অনুরোধ

একটি সহজ GET অনুরোধ:

ইনস্ট্যান্স

xhttp.open("GET", "demo_get.asp", true);
xhttp.send();

আপনার হাতে পরীক্ষা করুন

উপরোক্ত উদাহরণে, আপনি একটি ক্যাশ ফলাফল পাবেন। এই পরিস্থিতির প্রতিরোধ করতে, URL-তে একটি অভিন্ন ID যোগ করুন:

ইনস্ট্যান্স

xhttp.open("GET", "demo_get.asp?t=" + Math.random(), true);
xhttp.send();

আপনার হাতে পরীক্ষা করুন

যদি আপনি GET পদ্ধতি দিয়ে তথ্য পাঠাতে চান, তবে URL-তে এইসব তথ্য যোগ করুন:

ইনস্ট্যান্স

xhttp.open("GET", "demo_get2.asp?fname=Bill&lname=Gates", true);
xhttp.send();

আপনার হাতে পরীক্ষা করুন

POST অনুরোধ

একটি সহজ POST অনুরোধ:

ইনস্ট্যান্স

xhttp.open("POST", "demo_post.asp", true);
xhttp.send();

আপনার হাতে পরীক্ষা করুন

যদি আপনি HTML ফর্মের মতো ডাটা POST করতে চান, তবে এভাবে করুন: setRequestHeader() একটি HTTP হেডার যোগ করুন। অনুগ্রহ করে এখানে যোগ করুন: send() পদ্ধতিতে নির্দিষ্ট আপনাকে পাঠাতে হবের ডাটা:

ইনস্ট্যান্স

xhttp.open("POST", "ajax_test.asp", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("fname=Bill&lname=Gates");

আপনার হাতে পরীক্ষা করুন

পদ্ধতি বর্ণনা
setRequestHeader(header, value)

রিকোর্ডে HTTP হেডার যোগ করুন

  • header：নির্দিষ্ট হেডার নাম
  • value：নির্দিষ্ট হেডার মান

url - সার্ভারের ফাইল

open() পদ্ধতির url পারামিটার, সার্ভারের ফাইলের ঠিকানা হল:

xhttp.open("GET", "ajax_test.asp", true);

এই ফাইল কোনো ধরণের হতে পারে, .txt এবং .xml বা .asp এবং .php (যা প্রতিক্রিয়া পাওয়ার আগে সার্ভারে কাজ করতে পারে) এবং অন্যান্য

অসিঙ্ক্রোনাইজ - true বা false?

যদি আপনি অসিঙ্ক্রোনাইজ রিকোর্ড পাঠাতে চানopen() পদ্ধতিটি async পারামিটারকে true：

xhttp.open("GET", "ajax_test.asp", true);

অসিঙ্ক্রোনাইজ রিকোর্ড পাঠানো, তা হল একটি বিশাল পদক্ষেপ হয়েছে যা উইব ডেভেলপারদের জন্য। সার্ভারের প্রথমে বহুল্যমান কাজকর্ম খুব সময় লাগে। AJAX-এর আগে, এই কাজটি অ্যাপলিকেশনটির জন্য স্থগিত হতে পারে বা বন্ধ হতে পারে

অসিঙ্ক্রোনাইজ পদ্ধতিতে, JavaScript সার্ভারের প্রতিক্রিয়া অপেক্ষা করতে না হয়, বরং পারে:

  • সার্ভারের প্রতিক্রিয়া অপেক্ষা করতে অন্যান্য স্ক্রিপ্ট প্রচলন
  • প্রতিক্রিয়া প্রস্তুত হলে প্রক্রিয়াকরণ

onreadystatechange অপারেটর

XMLHttpRequest অবজেক্টের মাধ্যমে, আপনি রিকোর্ডটি পাওয়ার সময় কোনো ফাংশন প্রতিষ্ঠা করতে পারেন

এই ফাংশন XMLHttpResponse অবজেক্টের onreadystatechange যা নিম্নলিখিত হল:

ইনস্ট্যান্স

xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
    document.getElementById("demo").innerHTML = this.responseText;
  }
};
xhttp.open("GET", "ajax_info.txt", true);
xhttp.send();

আপনার হাতে পরীক্ষা করুন

আপনি কিছুকালীন অধ্যায়ে আরও বেশি জানতে পাবেন onreadystatechange-এর বিষয়ে

সিঙ্ক্রোনাইজ রিকোর্ড

যদি আপনি সিঙ্ক্রোনাইজ রিকোর্ড করতে চান, তবে এটা করুন open() মথুর তৃতীয়তম পারামিটারটিতে সেট করা হয় ফালস：

xhttp.open("GET", "ajax_info.txt", false);

কখনও অ্যাসিনক্রোনাস = false ব্যবহার করা হয় একটি দ্রুত পরীক্ষার জন্য।আপনি আরও পুরানো JavaScript কোডেও সিঙ্ক্রোনাস রিকোর্ডসমূহ দেখতে পাবেন。

কোডটি সার্ভার কাজ করা অপরিহার্য, সুতরাং onreadystatechange ফাংশন প্রয়োজন না করা হয়:

ইনস্ট্যান্স

xhttp.open("GET", "ajax_info.txt", false);
xhttp.send();
document.getElementById("demo").innerHTML = xhttp.responseText;

আপনার হাতে পরীক্ষা করুন

আমরা সিঙ্ক্রনাস XMLHttpRequest (async = false) নিশ্চিত না করি, কারণ JavaScript সার্ভার প্রতিক্রিয়া তৈরী হওয়ার পর্যন্ত কাজ করবে না।যদি সার্ভার ব্যস্ত বা ধীর হয়, এপ্লিকেশন হাঁটা বা থামবে。

সিঙ্ক্রনাস XMLHttpRequest এইচটিএমএল মানক থেকে অপসারিত হচ্ছে, কিন্তু এই প্রক্রিয়াটি বহুবছর ধরে চলতে পারে。

সিঙ্ক্রনাস এজেক্সএস রিকোর্ডসমূহকে ব্যবহার করা হয় না, কারণ এটা হলে মদের কাজটি সাইন্ক্রোনাস রিকোর্ডসমূহকে দেখা হবে, এবং এই হলে InvalidAccessError অপরাধীতা উঠতে পারে。