jquery aj .Axax থেকে কৌণিক $ HTTP


122

আমার কাছে jQuery কোডের এই টুকরা রয়েছে যা সূক্ষ্ম ক্রস উত্সকে কাজ করে:

jQuery.ajax({
    url: "http://example.appspot.com/rest/app",
    type: "POST",
    data: JSON.stringify({"foo":"bar"}),
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    success: function (response) {
        console.log("success");
    },
    error: function (response) {
        console.log("failed");
    }
});

এখন আমি এটিকে কোনও সফলতা ছাড়াই Angular.js কোডে রূপান্তর করতে চেষ্টা করছি:

$http({
    url: "http://example.appspot.com/rest/app",
    dataType: "json",
    method: "POST",
    data: JSON.stringify({"foo":"bar"}),
    headers: {
        "Content-Type": "application/json; charset=utf-8"
    }
}).success(function(response){
    $scope.response = response;
}).error(function(error){
    $scope.error = error;
});

কোন সাহায্য প্রশংসা।


3
কৌণিক.জেএস জানেন না তবে ফেইল () কোনও ফাংশনের ভুল নাম?
বোগদান রায়বাক

অন্য simular ইস্যু পাওয়া stackoverflow.com/questions/11786562/...
ছাত্রলীগ

গভীরভাবে খনন করা দরকার একটি সমাধান স্ট্যাকওভারফ্লো.com/ প্রশ্নগুলি / 12111936/ … সন্ধান করতে পারে ...
অবিরাম

অপশন অনুরোধটি একটি ব্রাউজার দ্বারা জারি করা হবে, এটি AngularJS / আপনার অ্যাপ্লিকেশনটির জন্য স্বচ্ছ হবে। যদি বিকল্পটি মূল অনুরোধটি সফল করে (পোষ্ট / জিইটি / যাই হোক না কেন) অনুসরণ করবে এবং আপনার কোডটি মূল অনুরোধের জন্য ফিরে যেতে হবে বিকল্পটি নয়।
পিকেজোলোস্কি.ওপেনসোর্স

এটি অনুরোধের পদ্ধতিটি বিকল্পগুলিতে পরিবর্তন করে সম্ভবত কৌণিক নয়। এটি সম্ভবত আপনার ব্রাউজারটি কোনও CORS অনুরোধ করতে পারে কিনা তা পরীক্ষা করে দেখছে। যদি আপনি একটি পৃথক ডোমেনে কল করার চেষ্টা করছেন তবে আপনার ব্রাউজারটি প্রথমে একটি অপশন অনুরোধ করবে এটি অনুমোদিত কিনা তা দেখার জন্য।
আয়ান

উত্তর:


202

Ular HTTP কল করার AngularJS উপায়টি দেখতে পাবেন:

$http({
    url: "http://example.appspot.com/rest/app",
    method: "POST",
    data: {"foo":"bar"}
}).then(function successCallback(response) {
        // this callback will be called asynchronously
        // when the response is available
        $scope.data = response.data;
    }, function errorCallback(response) {
        // called asynchronously if an error occurs
        // or server returns response with an error status.
        $scope.error = response.statusText;
});

বা শর্টকাট পদ্ধতি ব্যবহার করে আরও সহজ লেখা যেতে পারে:

$http.post("http://example.appspot.com/rest/app", {"foo":"bar"})
.then(successCallback, errorCallback);

লক্ষ্য করার মতো কয়েকটি বিষয় রয়েছে:

  • AngularJS সংস্করণটি আরও সংক্ষিপ্ত (বিশেষত। পোস্ট () পদ্ধতি ব্যবহার করে)
  • অ্যাঙ্গুলারজেএস জেএসএস স্ট্রিংগুলিতে জেএস বস্তুকে রূপান্তর করার এবং শিরোনামগুলি সেট করে (সেগুলি কাস্টমাইজযোগ্য)
  • কলব্যাক ফাংশনগুলির নামকরণ করা হয়েছে successএবং errorযথাক্রমে (প্রতিটি কলব্যাকের প্যারামিটারগুলিও দয়া করে নোট করুন) - কৌণিক ভি 1
  • ব্যবহারের thenপরিবর্তে কাজ করে।
  • ব্যবহারের আরও তথ্য এখানেthen পাওয়া যাবে

উপরেরটি কেবল একটি চটজলদি উদাহরণ এবং কিছু পয়েন্টার, আরও জন্য অ্যাংুলারজেএস ডকুমেন্টেশন চেক করতে ভুলবেন না: http://docs.angularjs.org/api/ng.$http


2
জানা ভাল! তবে আমি এর ক্লায়েন্টের ত্রুটির সাথে আমি যে বিষয়টি নিয়ে কাজ করছি তাতে কিছু আসে যায় না, কৌনিকটি অনুরোধের পদ্ধতিটি বিকল্পগুলিতে পরিবর্তন করে। মনে করি এটি সমর্থন করার জন্য আমাকে কিছু সার্ভার সাইড স্টাফ করতে হবে
অবিরাম

হ্যাঁ, আমি অনুমান করি আপনাকে প্রথমে সার্ভার-সাইড সমস্যাগুলি বাছাই করতে হবে। তারপরে আপনি ক্লায়েন্টের পক্ষে কৌনিক $ http এর সম্পূর্ণ শক্তি উপভোগ করতে পারবেন। সম্ভবত আপনি অতিরিক্ত বিকল্পের অনুরোধ দেখতে পান যেহেতু অ্যাংুলারজেএস jQuery এর তুলনায় আরও / বিভিন্ন শিরোনাম প্রেরণ করছে।
পিকেজোলোস্কি.ওপেনসোর্স

1
দ্রষ্টব্য: "ডেটা:" কিন্তু না: পান "প্যারাম" দেখুন stackoverflow.com/questions/13760070/...
xander27

5
paramsএবং data2 টি আলাদা জিনিস: প্যারামগুলি ইউআরএল (ক্যোয়ারী স্ট্রিং) এ শেষ হয় যখন ডেটা - অনুরোধের বডি (কেবল অনুরোধের ধরণের জন্য যা আসলে শরীর থাকতে পারে)।
pkozlowski.opensource

"কৌনিকটি অনুরোধের পদ্ধতিটি বিকল্পগুলিতে পরিবর্তন করুন think মনে করুন এটির সমর্থন করার জন্য আমাকে কিছু সার্ভার সাইড স্টাফ করতে হবে" আমার একই সমস্যা হচ্ছে, কৌণিক কী জিকুরিটি যুক্ত করে না?
অ্যান্ড্রু লুহরিং

1

আমরা অ্যাঙ্গুলারজেসে HTTP পরিষেবা ব্যবহার করে এজ্যাক্স অনুরোধটি প্রয়োগ করতে পারি, যা দূরবর্তী সার্ভার থেকে ডেটা পড়তে / লোড করতে সহায়তা করে।

$ http পরিষেবা পদ্ধতি নীচে তালিকাভুক্ত করা হয়েছে,

 $http.get()
 $http.post()
 $http.delete()
 $http.head()
 $http.jsonp()
 $http.patch()
 $http.put()

উদাহরণগুলির মধ্যে একটি:

    $http.get("sample.php")
        .success(function(response) {
            $scope.getting = response.data; // response.data is an array
    }).error(){

        // Error callback will trigger
    });

http://www.drtuts.com/ajax-requests-angularjs/



-5

আপনি ডেটা বরাদ্দ করতে para .প্রেম ব্যবহার করতে পারেন:

 $http({
  url: "http://example.appspot.com/rest/app",
  method: "POST",
  data: $.param({"foo":"bar"})
  }).success(function(data, status, headers, config) {
   $scope.data = data;
  }).error(function(data, status, headers, config) {
   $scope.status = status;
 });

এটি দেখুন: AngularJS + ASP.NET ওয়েব এপিআই ক্রস-ডোমেন ইস্যু


4
কেবলমাত্র একটি নোট যে para .প্রামটি jQuery, তাই আপনার এটি ব্যবহার করতে jQuery লোড হওয়া প্রয়োজন। $ Http ট্রান্সফর্মআরকুয়েস্ট ইন্টারসেপ্টর ব্যবহার করে একটি jQuery মুক্ত উদাহরণের জন্য, পেস্টবিন.com
ব্রায়ান

@ ব্রায়ান এক মিনিট অপেক্ষা করুন, jQuery অ্যাঙ্গুলারজেএস এর নির্ভরতা নয়? প্রথমে jQuery লোড না করে আপনার কখনই $ http হবে না।
jnm2

2
@ jnm2 - না, jQuery অ্যাংুলারজেএস এর নির্ভরতা নয়। $ HTTP কৌণিক $ http পরিষেবা উপাদানকে বোঝায় , jQuery থেকে কিছুই নয়। অ্যাঙ্গুলারজেএস-এ ডিওএমকে পরিচালনা করার জন্য একটি "জিক্যুয়ারি লাইট" পাওয়া যায় তবে এটি খুব সীমাবদ্ধ। কৌণিক উপাদান থেকে - jQuery উপলভ্য থাকলে, কৌণিক.এলিমেন্ট jQuery ফাংশনের জন্য একটি উপনাম। যদি jQuery উপলভ্য না থাকে, তবে কৌণিক.এলিমেন্ট অ্যাঙ্কুলারের jQuery এর অন্তর্নির্মিত সাবসেটে প্রতিনিধি, যাকে "jQuery লাইট" বা "jqLite" বলা হয়।
ব্রায়ান
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.