AngularJS $ http.get अनुरोध पर डेटा पास करना

Question

मेरे पास एक फ़ंक्शन है जो http POST अनुरोध करता है। कोड नीचे दिया गया है। यह ठीक काम करता है।

 $http({
   url: user.update_path, 
   method: "POST",
   data: {user_id: user.id, draft: true}
 });

मेरे पास http GET का एक और कार्य है और मैं उस अनुरोध पर डेटा भेजना चाहता हूं। लेकिन मेरे पास वह विकल्प नहीं है।

 $http({
   url: user.details_path, 
   method: "GET",
   data: {user_id: user.id}
 });

के लिए वाक्यविन्यास http.getहै

प्राप्त करें (url, config)

Answer 1

HTTP GET अनुरोध में सर्वर पर पोस्ट किया जाने वाला डेटा नहीं हो सकता है। हालाँकि, आप अनुरोध के लिए एक क्वेरी स्ट्रिंग जोड़ सकते हैं।

angular.http नामक इसके लिए एक विकल्प प्रदान करता है params।

$http({
    url: user.details_path, 
    method: "GET",
    params: {user_id: user.id}
 });

देखें: http://docs.angularjs.org/api/ng.$http#get और https://docs.angularjs.org/api/ng/service/$http#usage ( paramsपरम को दर्शाता है )

Comments

यह एक वादा लौटाएगा

— कॉनर लीच

वादा के साथ कोड: $ http ({विधि: 'प्राप्त करें, url:' / someUrl '})। सफलता (फ़ंक्शन (डेटा, स्थिति, हेडर, कॉन्फिगरेशन) {// इस कॉलबैक को एसिंक्रोनसली // कहा जाएगा जब प्रतिक्रिया उपलब्ध होगी})। त्रुटि (फ़ंक्शन (डेटा, स्थिति, हेडर, कॉन्फ़िगरेशन) {// असिंक्रोनसली कहा जाता है यदि कोई त्रुटि होती है // या सर्वर त्रुटि स्थिति के साथ प्रतिक्रिया देता है।});

— एहुद ग्रैंड

कोणीय भी कार्यक्षमता प्रदान करता है $http.get(url.details_path, {params: {user_id: user.id}})।

— enpenax

यह अच्छा होगा कि ऑब्जेक्ट को HTTP क्रियाओं के बीच सुसंगत रखा जाए ... GET के लिए POST और params के लिए डेटा प्रतिसंतुलित है।

— ह्यूबर्ट पेर्रोन

@HubertPerron वास्तव में यह काउंटरटाइनेटिव नहीं है क्योंकि ये अलग-अलग चीजें हैं: DATA किसी ऑब्जेक्ट / मॉडल का प्रतिनिधित्व कर सकता है, यहां तक ​​कि नेस्टेड भी, और POST हेडर का हिस्सा बन जाता है ... PARAMS यह दर्शाता है कि आप GET url में क्या जोड़ सकते हैं, जहां प्रत्येक संपत्ति एक का प्रतिनिधित्व करती है url में querystring का हिस्सा। यह अच्छा है कि उनका नामकरण अलग है क्योंकि यह आपको इस तथ्य से अवगत कराता है कि आप कुछ अलग कर रहे हैं।

— जोस

Answer 2

आप निम्न कार्य ठीक करने के लिए सीधे परमेस पास कर सकते$http.get() हैं

$http.get(user.details_path, {
    params: { user_id: user.id }
});

Comments

यह काम करता है लेकिन परम ऑब्जेक्ट को स्ट्रिंग में परिवर्तित किया जा रहा है। मैं मूल वस्तु को कैसे रख सकता हूं?

— wdphd

@wdphd यह HTTP के लिए अंतर्निहित है कि यह एक क्वेरी स्ट्रिंग को एन्कोड किया जाएगा

— Uli Köhler

@ यूली कोहलर: यूप, यह याद किया। मैं यूआई राउटर की तर्ज पर सोच रहा था जहां आप डेटा प्रकार को निर्दिष्ट कर सकते हैं। बैकएंड पर एक साधारण parseInt के साथ यह तय किया।

— wdphd

यह सही समाधान है यदि आप दिए गए URL में GET पैरामीटर जोड़ना चाहते हैं और पूरी तरह से ठीक काम करते हैं।

— एनपेनैक्स

@Juan, stackoverflow.com/questions/417142/...

— रोब

Answer 3

AngularJS v1.4.8 से शुरू , आप get(url, config) निम्नानुसार उपयोग कर सकते हैं :

var data = {
 user_id:user.id
};

var config = {
 params: data,
 headers : {'Accept' : 'application/json'}
};

$http.get(user.details_path, config).then(function(response) {
   // process response here..
 }, function(response) {
});

Comments

लेकिन यह डेटा अभी भी एक अनुरोध निकाय में नहीं है।

— naXa

@naXa GET को केवल कन्वेंशन द्वारा url params होना चाहिए, इसलिए कई फ्रेमवर्क इसे सर्वश्रेष्ठ अभ्यास को लागू करने की अनुमति नहीं देंगे, भले ही तकनीकी रूप से यह काम कर सके और समझ में आ सके।

— क्रिस्टोफ रूसो

यदि केवल AngularJS प्रलेखन यह सरल उदाहरण प्रदान कर सकता था!

— नॉर्बर्ट नॉर्बर्टन

@ अर्पित अग्रवाल क्या आप गोलगप्पे के वेब सर्वर और वीजे के साथ इसी तरह के प्रश्न पर एक नज़र रखने में इतने दयालु होंगे? stackoverflow.com/questions/61520048/…

— user2315094

Answer 4

उन लोगों के लिए समाधान जो जीईटी अनुरोध में परमर्स और हेडर भेजने में रुचि रखते हैं

$http.get('https://www.your-website.com/api/users.json', {
        params:  {page: 1, limit: 100, sort: 'name', direction: 'desc'},
        headers: {'Authorization': 'Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ=='}
    }
)
.then(function(response) {
    // Request completed successfully
}, function(x) {
    // Request error
});

पूर्ण सेवा उदाहरण इस तरह दिखेगा

var mainApp = angular.module("mainApp", []);

mainApp.service('UserService', function($http, $q){

   this.getUsers = function(page = 1, limit = 100, sort = 'id', direction = 'desc') {

        var dfrd = $q.defer();
        $http.get('https://www.your-website.com/api/users.json', 
            {
                params:{page: page, limit: limit, sort: sort, direction: direction},
                headers: {Authorization: 'Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ=='}
            }
        )
        .then(function(response) {
            if ( response.data.success == true ) { 

            } else {

            }
        }, function(x) {

            dfrd.reject(true);
        });
        return dfrd.promise;
   }

});

Comments

नियंत्रक में प्रतिक्रिया डेटा का उपयोग कैसे किया जाएगा? धन्यवाद।

— फ्लोरिस

Answer 5

तुम भी बस यूआरएल के अंत में मापदंडों को जोड़ सकते हैं:

$http.get('path/to/script.php?param=hello').success(function(data) {
    alert(data);
});

Script.php के साथ जोड़ा गया:

<? var_dump($_GET); ?>

निम्नलिखित जावास्क्रिप्ट अलर्ट में परिणाम:

array(1) {  
    ["param"]=>  
    string(4) "hello"
}

Comments

$ http क्या कोई बच निकलता है?

— माइकल कोल

यह भी काम करता है, लेकिन इसके साथ समस्या यह है कि जब आपके पास कई पैरामीटर होते हैं तो यह एक दर्द हो जाता है जो उन्हें url के अंत में जोड़ देता है और यदि आप एक चर नाम बदलते हैं तो आपको इसे url में भी आना होगा और इसे बदलना होगा।

— user3718908

मुझे पता है। यह एक प्रदर्शन था, यह दर्शाता है कि आप इसे नियमित रूप से भी कर सकते हैं , मैं जरूरी नहीं कि यह सिफारिश करता हूं। (जहां 'नियमित तरीका' का मतलब है कि आपने शायद इसे php के साथ वर्षों तक कैसे किया है)

— जेफरी रोसेनडेल

Answer 6

ASP.NET MVC में कोणीय.js का उपयोग करते हुए मापदंडों के साथ HTTP GET अनुरोध का एक पूरा उदाहरण यहां दिया गया है:

नियंत्रक:

public class AngularController : Controller
{
    public JsonResult GetFullName(string name, string surname)
    {
        System.Diagnostics.Debugger.Break();
        return Json(new { fullName = String.Format("{0} {1}",name,surname) }, JsonRequestBehavior.AllowGet);
    }
}

राय:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script type="text/javascript">
    var myApp = angular.module("app", []);

    myApp.controller('controller', function ($scope, $http) {

        $scope.GetFullName = function (employee) {

            //The url is as follows - ControllerName/ActionName?name=nameValue&surname=surnameValue

            $http.get("/Angular/GetFullName?name=" + $scope.name + "&surname=" + $scope.surname).
            success(function (data, status, headers, config) {
                alert('Your full name is - ' + data.fullName);
            }).
            error(function (data, status, headers, config) {
                alert("An error occurred during the AJAX request");
            });

        }
    });

</script>

<div ng-app="app" ng-controller="controller">

    <input type="text" ng-model="name" />
    <input type="text" ng-model="surname" />
    <input type="button" ng-click="GetFullName()" value="Get Full Name" />
</div>

Comments

IMHO सिंटैक्स params'मैनुअल' url कॉनसैट की तुलना में कम त्रुटि वाला है

— क्रिस्टोफ़ रूसो

Answer 7

भेजने के लिए मैं उपयोग पैरामीटर के साथ अनुरोध मिलता है

  $http.get('urlPartOne\\'+parameter+'\\urlPartTwo')

इसके द्वारा आप अपने खुद के यूआरएल स्ट्रिंग का उपयोग कर सकते हैं