javascript - jQuery: AJAX কল সাফল্যের পরে তথ্য ফেরত




(4)

আমার কাছে এমন কিছু আছে, যেখানে এটি একটি স্ক্রিপ্টের জন্য একটি সহজ কল যা আমাকে একটি মান, একটি স্ট্রিং দেয় ..

function testAjax() {
    $.ajax({
      url: "getvalue.php",  
      success: function(data) {
         return data; 
      }
   });
}

কিন্তু আমি এই মত কিছু কল

var output = testAjax(svar);  // output will be undefined...

তাই আমি কিভাবে মূল্য ফেরত দিতে পারি? নিচের কোডটি কাজ করছে বলে মনে হচ্ছে না ...

function testAjax() {
    $.ajax({
      url: "getvalue.php",  
      success: function(data) {

      }
   });
   return data; 
}

Jquery ডক্স উদাহরণ দেখুন: http://api.jquery.com/jQuery.ajax/ (প্রায় ২/3 পৃষ্ঠা)

আপনি নিম্নলিখিত কোড খুঁজছেন হতে পারে:

    $.ajax({
     url: 'ajax/test.html',
     success: function(data) {
     $('.result').html(data);
     alert('Load was performed.');
   }
});

একই পাতা ... নিচে নিচে।


আইডিকে যদি আপনি এটি সমাধান করেন কিন্তু আমি এটি করার অন্য উপায়টি সুপারিশ করি, এবং এটি কাজ করে :)

    ServiceUtil = ig.Class.extend({
        base_url : 'someurl',

        sendRequest: function(request)
        {
            var url = this.base_url + request;
            var requestVar = new XMLHttpRequest();
            dataGet = false;

            $.ajax({
                url: url,
                async: false,
                type: "get",
                success: function(data){
                    ServiceUtil.objDataReturned = data;
                }
            });
            return ServiceUtil.objDataReturned;                
        }
    })

সুতরাং এখানে মূল ধারণা হল, async যোগ করে: মিথ্যা, তারপর আপনি তথ্য পুনরুদ্ধার না হওয়া পর্যন্ত সবকিছু অপেক্ষা করে। তারপর আপনি ক্লাসের স্ট্যাটিক পরিবর্তনশীল এটি বরাদ্দ করুন, এবং সবকিছু জাদু কাজ করে :)


ফাংশন থেকে ডেটা ফেরত দেওয়ার একমাত্র উপায় একটি অ্যাসিঙ্ক্রোনাস কল পরিবর্তে একটি সিঙ্ক্রোনাস কল করতে হবে, তবে এটি প্রতিক্রিয়াটির জন্য অপেক্ষা করার সময় ব্রাউজারটিকে নিশ্চিহ্ন করবে।

আপনি একটি কলব্যাক ফাংশন পাস করতে পারেন যা ফলাফল পরিচালনা করে:

function testAjax(handleData) {
  $.ajax({
    url:"getvalue.php",  
    success:function(data) {
      handleData(data); 
    }
  });
}

এটির মতো কল করুন:

testAjax(function(output){
  // here you use the output
});
// Note: the call won't wait for the result,
// so it will continue with the code here while waiting.

দ্রষ্টব্য: এই উত্তর ফেব্রুয়ারী 2010 সালে লেখা হয়েছিল।
২015, 2016 এবং ২017 সাল থেকে নীচে আপডেটগুলি দেখুন।

আপনি কোনও ফাংশন থেকে অ্যার্ক্রোনাসাসের কিছু ফেরত দিতে পারবেন না। আপনি কি ফিরে আসতে পারেন একটি প্রতিশ্রুতি । আমি জাভাস্ক্রিপ্টে তাদের প্রশ্নের উত্তরগুলিতে কীভাবে প্রতিশ্রুতি দিচ্ছি তা ব্যাখ্যা করেছি:

যদি আপনি ব্যাখ্যা করতে পারেন কেন আপনি তথ্যটি ফেরত দিতে চান এবং পরে আপনি এর সাথে কী করতে চান তবে আমি কীভাবে এটি সম্পর্কে আরো নির্দিষ্ট উত্তর দিতে সক্ষম হতে পারি।

সাধারণত, পরিবর্তে:

function testAjax() {
  $.ajax({
    url: "getvalue.php",  
    success: function(data) {
      return data; 
    }
  });
}

আপনি এই মত আপনার testAjax ফাংশন লিখতে পারেন:

function testAjax() {
  return $.ajax({
      url: "getvalue.php"
  });
}

তারপর আপনি এই মত আপনার প্রতিশ্রুতি পেতে পারেন:

var promise = testAjax();

আপনি আপনার প্রতিশ্রুতিটি সংরক্ষণ করতে পারেন, আপনি এটি প্রায় পাস করতে পারেন, ফাংশন কলগুলিতে এটি একটি যুক্তি হিসাবে ব্যবহার করতে পারেন এবং আপনি ফাংশন থেকে এটি ফিরিয়ে আনতে পারেন , কিন্তু যখন আপনি অবশেষে আপনার ডেটাটি AJAX কল দ্বারা ফেরত পাঠাতে চান, তখন আপনাকে এটা এভাবে করো:

promise.success(function (data) {
  alert(data);
});

(সরলীকৃত সিনট্যাক্সের জন্য নীচের আপডেট দেখুন।)

আপনার তথ্য এই সময়ে উপলব্ধ হলে এই ফাংশন অবিলম্বে আহ্বান করা হবে। তা না হলে তথ্যটি যত তাড়াতাড়ি সম্ভব পাওয়া যাবে।

এই সব করার সম্পূর্ণ পয়েন্টটি হল যে আপনার ডেটা $$ এর পরে অবিলম্বে উপলব্ধ হবে না। কারণ এটি অগণিত। প্রতিশ্রুতিগুলি ফাংশনগুলির জন্য একটি চমৎকার বিমূর্ততা বলে: আমি আপনাকে তথ্যটি ফেরত দিতে পারছি না কারণ আমার কাছে এখনো এটি নেই এবং আমি আপনাকে অবরোধ করতে এবং অপেক্ষা করতে চাই না তাই এখানে এটি একটি প্রতিশ্রুতি এবং আপনি এটি করতে সক্ষম হবেন পরে এটি ব্যবহার করুন, অথবা শুধু অন্য কাউকে দিতে এবং এটি দিয়ে কাজ করা।

এই DEMO দেখুন।

আপডেট (2015)

বর্তমানে (মার্চ, ২015 সালের হিসাবে) jQuery প্রতিশ্রুতিগুলি প্রতিশ্রুতি / এ + স্পেসিফিকেশনের সাথে সামঞ্জস্যপূর্ণ নয় যার অর্থ তারা অন্যান্য প্রতিশ্রুতি / A + কনফরম্যান্ট বাস্তবায়নের সাথে খুব ভালভাবে সহযোগিতা করতে পারে না।

তবে আসন্ন সংস্করণ 3.x এ জাভাস্ক্রিপ্ট প্রতিশ্রুতি প্রতিশ্রুতি / এ + স্পেসিফিকেশন (এটি নির্দেশ করার জন্য বেঞ্জামিন গ্রুনাবামকে ধন্যবাদ) এর সাথে সামঞ্জস্যপূর্ণ হবে । বর্তমানে (মে ২015 হিসাবে) jQuery এর স্থিতিশীল সংস্করণগুলি 1.x এবং 2.x।

আমি উপরে বর্ণিত (মার্চ, ২011) jQuery এর ডিফার্ড অবজেক্টগুলিকে অ্যাসাইন্রোনাশে কিছু করার উপায় যা একটি মান ফেরত সমেত সমান্তরাল কোড অর্জন করা হবে।

কিন্তু একটি সিঙ্ক্রোনাস ফাংশন কল দুটি জিনিস করতে পারে - এটি একটি মান প্রদান করতে পারে (যদি এটি করতে পারে) অথবা একটি ব্যতিক্রম ফেলে দিতে পারে (যদি এটি কোনও মান না ফেরত পারে)। প্রতিশ্রুতি / A + উভয় ক্ষেত্রেই সেগুলি এমনভাবে ব্যবহার করে যা সিঙ্ক্রোনাস কোডে ব্যতিক্রম হ্যান্ডলিংয়ের মতো শক্তিশালী। JQuery সংস্করণটি একটি মানকে ঠিকঠাক ফেরত সমেত সামঞ্জস্যপূর্ণ করে তবে জটিল ব্যতিক্রম হ্যান্ডলিং সমতুল্য কিছুটা সমস্যাযুক্ত।

বিশেষত, সিঙ্ক্রোনাস কোডে ব্যতিক্রম হ্যান্ডলিংয়ের পুরো বিন্দুটি কেবল একটি সুন্দর বার্তা ছাড়াই নয়, তবে সমস্যাটি সমাধানের চেষ্টা করছে এবং মৃত্যুদন্ড কার্যকর করার চেষ্টা করছে, অথবা সম্ভবত প্রোগ্রামটির অন্য অংশগুলির জন্য একই বা ভিন্ন ব্যতিক্রম পুনঃস্থাপন করছে। হাতল. সমলয় কোড আপনি একটি কল স্ট্যাক আছে। অ্যাসিঙ্ক্রোনাস কল ইন আপনি প্রতিশ্রুতি / A + স্পেসিফিকেশন দ্বারা প্রয়োজনীয় আপনার প্রতিশ্রুতির ভিতরে উন্নত ব্যতিক্রম হ্যান্ডলিং না এবং সত্যিই কোড ব্যবহার করতে আপনাকে সাহায্য করতে পারে যা জটিল ব্যবহারের ক্ষেত্রে এমনকি অর্থপূর্ণ উপায়ে ভুল এবং ব্যতিক্রমগুলি পরিচালনা করবে।

JQuery এবং অন্যান্য বাস্তবায়নের মধ্যে পার্থক্যগুলির জন্য, এবং কীভাবে কীভাবে jQuery কীভাবে প্রতিশ্রুতি / প্রতিশ্রুতিগুলিকে প্রতিশ্রুতি দেয় তার প্রতিশ্রুতির জন্য, ক্রিস কওয়েল এট আল দ্বারা jQuery থেকে আসছে দেখুন। প্রশ্ন লাইব্রেরি উইকি এবং Promises জাভাস্ক্রিপ্ট জ্যাক আর্কাইভাল্ড দ্বারা HTML5 রক্স এ পৌঁছেছেন

কিভাবে একটি বাস্তব প্রতিশ্রুতি ফিরে

উপরের আমার উদাহরণ থেকে ফাংশন:

function testAjax() {
  return $.ajax({
      url: "getvalue.php"
  });
}

একটি jqXHR অবজেক্ট প্রদান করে যা একটি jQuery ডিফার্ড অবজেক্ট

এটি একটি বাস্তব প্রতিশ্রুতি ফিরিয়ে আনতে, আপনি এটিতে পরিবর্তন করতে পারেন - প্রশ্ন উইকি থেকে পদ্ধতি ব্যবহার করে :

function testAjax() {
  return Q($.ajax({
      url: "getvalue.php"
  }));
}

অথবা, HTML5 রকস নিবন্ধ থেকে পদ্ধতি ব্যবহার করে :

function testAjax() {
  return Promise.resolve($.ajax({
      url: "getvalue.php"
  }));
}

এই Promise.resolve($.ajax(...)) promise মডিউল ডকুমেন্টেশন এও ব্যাখ্যা করা হয়েছে এবং এটি ES6 Promise.resolve() সাথে কাজ করা উচিত।

ES6 প্রতিশ্রুতিগুলি ব্যবহার করতে আজকে আপনি জেক আর্কাইবার্ড দ্বারা polyfill() প্রতিশ্রুতি মডিউলের polyfill() ব্যবহার করতে পারেন।

আপনি পলিফিল ছাড়া ES6 প্রতিশ্রুতিগুলি কোথায় ব্যবহার করতে পারেন তা দেখতে, দেখুন: আমি ব্যবহার করতে পারি: প্রতিশ্রুতি

আরও তথ্যের জন্য দেখুন:

JQuery এর ভবিষ্যত

JQuery এর ভবিষ্যত সংস্করণগুলি (3.x থেকে শুরু হচ্ছে - ২015 সালের মে মাসের হিসাবে বর্তমান স্থিতিশীল সংস্করণগুলি 1.x এবং 2.x) প্রতিশ্রুতি / A + স্পেসিফিকেশানের সাথে সামঞ্জস্যপূর্ণ হবে (মন্তব্যগুলিতে এটি উল্লেখ করার জন্য বেঞ্জামিন গ্রুনাবামকে ধন্যবাদ)। "আমরা ইতিমধ্যে সিদ্ধান্ত নিয়েছি যে দুটি পরিবর্তন আমাদের বিলম্বিত বাস্তবায়নের জন্য প্রতিশ্রুতি / A + সামঞ্জস্য [...]" ( jQuery 3.0 এবং ওয়েব ডেভেলপমেন্টের ভবিষ্যত )। আরও তথ্যের জন্য দেখুন: জাভাস্ক্রিপ্ট 3.0: ডেভ মেথভিনের পরবর্তী প্রজন্ম এবং jQuery 3.0: আরও ইন্টারঅপারোপলিবিলিটি, পল ক্রিলের কম ইন্টারনেট এক্সপ্লোরার

আকর্ষণীয় আলোচনা

আপডেট (2016)

ECMA-262, 6 র্থ সংস্করণে, ধারা 14.2- এ একটি নতুন সিনট্যাক্স রয়েছে যা তীরের ফাংশন বলা হয় যা উপরের উদাহরণগুলি আরও সহজ করতে ব্যবহার করতে পারে।

JQuery API ব্যবহার করে পরিবর্তে:

promise.success(function (data) {
  alert(data);
});

তুমি লিখতে পারো:

promise.success(data => alert(data));

বা প্রতিশ্রুতি / এ + API ব্যবহার করে:

promise.then(data => alert(data));

প্রত্যাখ্যান হ্যান্ডলারগুলি সর্বদা ব্যবহার করে মনে রাখবেন:

promise.then(data => alert(data), error => alert(error));

বা সঙ্গে:

promise.then(data => alert(data)).catch(error => alert(error));

আপনি প্রতিশ্রুতি সঙ্গে সবসময় প্রত্যাখ্যান হ্যান্ডলার ব্যবহার করা উচিত কেন দেখতে এই উত্তর দেখুন:

অবশ্যই এই উদাহরণে আপনি কেবলমাত্র প্রতিশ্রুতি ব্যবহার করতে পারেন। promise.then(alert) কারণ আপনি আপনার কলব্যাকের মতো একই আর্গুমেন্টগুলির সাথে alert আহ্বান করছেন, তবে তীর সিনট্যাক্সটি আরও সাধারণ এবং আপনাকে কিছু লিখতে দেয়:

promise.then(data => alert("x is " + data.x));

প্রতিটি ব্রাউজার এখনও এই সিনট্যাক্সটিকে সমর্থন করে না, তবে নির্দিষ্ট কিছু ক্ষেত্রে আপনার কোডটি কীভাবে চলবে তা নিশ্চিত করার সময় - যেমন ক্রোম এক্সটেনশান লেখার সময়, একটি ফায়ারফক্স অ্যাড-অন বা ইলেক্ট্রন, এনডব্লিউজেএস ব্যবহার করে একটি ডেস্কটপ অ্যাপ্লিকেশন বা AppJS (বিস্তারিত জানার জন্য এই উত্তর দেখুন)।

তীর ফাংশন সমর্থনের জন্য, দেখুন:

আপডেট (2017)

এখন একটি নতুন নতুন সিনট্যাক্স আছে যা এখন অ্যাসাইন ফাংশন নামক একটি নতুন await শব্দ যা এই কোডটির পরিবর্তে বলা হয়েছে:

functionReturningPromise()
    .then(data => console.log('Data:', data))
    .catch(error => console.log('Error:', error));

আপনাকে লিখতে দেয়:

try {
    let data = await functionReturningPromise();
    console.log('Data:', data);
} catch (error) {
    console.log('Error:', error);
}

আপনি শুধুমাত্র async কীওয়ার্ড দিয়ে তৈরি ফাংশনের ভিতরে এটি ব্যবহার করতে পারেন। আরও তথ্যের জন্য, দেখুন:

ব্রাউজারে সমর্থনের জন্য, দেখুন:

নোড সমর্থনের জন্য, দেখুন:

এমন জায়গায় যেখানে আপনার async জন্য স্থানীয় সমর্থন নেই এবং await আপনি async ব্যবহার করতে পারেন:

অথবা সামান্য ভিন্ন সিনট্যাক্স co একটি জেনারেটর ভিত্তিক পদ্ধতিতে যেমন co বা bluebird coroutines:

অধিক তথ্য

আরো বিস্তারিত জানার জন্য প্রতিশ্রুতি সম্পর্কে কিছু অন্যান্য প্রশ্ন:







ajax