मैं अनुरोध पेलोड के बजाय फॉर्म डेटा के रूप में डेटा कैसे पोस्ट कर सकता हूं?

Question

नीचे दिए गए कोड में, AngularJS $httpपद्धति URL को कॉल करती है, और xsrf ऑब्जेक्ट को "अनुरोध पेलोड" (क्रोम डीबगर नेटवर्क टैब में वर्णित) के रूप में सबमिट करता है। JQuery $.ajaxविधि एक ही कॉल करती है, लेकिन xsrf को "फ़ॉर्म डेटा" के रूप में प्रस्तुत करती है।

मैं अनुरोध पेलोड के बजाय एंगुलरजेएस को फॉर्म डेटा के रूप में एक्सएसआरएफ कैसे जमा कर सकता हूं?

var url = 'http://somewhere.com/';
var xsrf = {fkey: 'xsrf key'};

$http({
    method: 'POST',
    url: url,
    data: xsrf
}).success(function () {});

$.ajax({
    type: 'POST',
    url: url,
    data: xsrf,
    dataType: 'json',
    success: function() {}
});

Comments

यह एक बहुत ही उपयोगी प्रश्न था। यह मुझे एक स्ट्रिंग के रूप में एक पेलोड भेजने की अनुमति देता है (सामग्री-प्रकार बदलकर), जो मुझे पोस्ट / जीईटी से पहले विकल्पों से निपटने से रोकता है।

— अर्थमुन

मेरे पास एक ही सवाल है, यह url का अनुरोध करने के बाद है, लेकिन मुझे वह पैरामीटर नहीं मिल सकता है, जो मैं प्रस्तुत करता हूं

— '50 '

Answer 1

निम्न पंक्ति को पारित किए जाने वाले $ http ऑब्जेक्ट में जोड़ा जाना चाहिए:

headers: {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}

और पास किया गया डेटा URL-एन्कोडेड स्ट्रिंग में परिवर्तित किया जाना चाहिए:

> $.param({fkey: "key"})
'fkey=key'

तो आपके पास कुछ ऐसा है:

$http({
    method: 'POST',
    url: url,
    data: $.param({fkey: "key"}),
    headers: {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}
})

प्रेषक: https://groups.google.com/forum/# .msg/ angular/ 5nAedJ1LyO0/ 4Vj_72EZcDsJ

अपडेट करें

AngularJS V1.4 के साथ जोड़ी गई नई सेवाओं का उपयोग करने के लिए, देखें

• केवल AngularJS सेवाओं का उपयोग करके URL-एन्कोडिंग चर

Comments

क्या JSON> डेटा का url एन्कोडिंग स्वचालित रूप से होने या प्रत्येक POST या PUT विधि के लिए यह निर्दिष्ट करने का कोई तरीका है?

— डॉगोकू

+1 @mjibson, मेरे लिए हेडर पास करना भी काम नहीं कर रहा था, जब तक कि मैंने आपके उत्तर को इस तरह से नहीं देखा: यह var xsrf = $.param({fkey: "key"});बेवकूफी है, कोणीय इसे आंतरिक रूप से क्यों नहीं कर सकता?

— naikus

$ .Ajax डिफ़ॉल्ट व्यवहार का अनुसरण करने के लिए, सामग्री प्रकार हेडर में चारसेट को भी निर्दिष्ट किया जाना चाहिए -headers: {Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'}

— Imre

JQuery के परम फ़ंक्शन का उपयोग करने के बजाय, सिर्फ $ http अनुरोध पर पैरामीटर गुण सेट और यह क्या jQuery.param पद्धति के रूप में लंबे समय के रूप Content-Type हैडर है 'आवेदन / x-www फार्म-urlencoded' करता क्या करेंगे - stackoverflow .com / प्रश्न / 18967307 /…

— 19

@spig हाँ, यह वही करेगा जो jQuery.param करता है, लेकिन, यदि आप params संपत्ति का उपयोग करते हैं तो आपके गुण शरीर के बजाय अनुरोध URL के भाग के रूप में एन्कोड हो जाएंगे - भले ही आपने एप्लिकेशन / x-www निर्दिष्ट किया हो प्रपत्र- urlencoded हेडर।

— स्टियन

Answer 2

यदि आप समाधान में jQuery का उपयोग नहीं करना चाहते हैं तो आप यह कोशिश कर सकते हैं। यहाँ से समाधान nabbed https://stackoverflow.com/a/1714899/1784301

$http({
    method: 'POST',
    url: url,
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    transformRequest: function(obj) {
        var str = [];
        for(var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
        return str.join("&");
    },
    data: xsrf
}).success(function () {});

Comments

यह विधि मेरे लिए कोणीय 1.2.x में काम करती है, और मुझे लगता है कि यह सबसे अच्छा जवाब है क्योंकि यह सुरुचिपूर्ण है, यह कोर कोणीय में काम करता है और jQuery जैसी किसी भी बाहरी लाइब्रेरी पर निर्भर नहीं करता है।

— gregtczap

$ संसाधन की कार्रवाई के अंदर इस पद्धति का उपयोग करते समय मुझे एक समस्या हुई। फॉर्म डेटा में $ get, $ save आदि के लिए फ़ंक्शन भी शामिल थे। समाधान यह था कि forस्टेटमेंट को बदलने के लिए थोड़ा बदल angular.forEachदिया जाए।

— एंथनी

ध्यान दें कि $ .param () के विपरीत यह विधि सरणियों / वस्तुओं पर पुनरावर्ती रूप से काम नहीं करती है।

— १५:५४ पर भूलभुलैया

मैं जाँचता हूँ कि obj[p]यह अशक्त या अपरिभाषित नहीं है । अन्यथा आप मूल्य के रूप में "अशक्त" या "अपरिभाषित" स्ट्रिंग भेजना समाप्त करेंगे।

— तामिर

मुझे समझ नहीं आ रहा था transformRequest: function(obj)कि obj अपरिभाषित है, क्या हम मान लेते हैं कि xsrf पास है? जैसेtransformRequest: function(xsrf)

— अक्षय तरु

Answer 3

इस मुद्दे को लेकर जारी भ्रम ने मुझे इसके बारे में एक ब्लॉग पोस्ट लिखने के लिए प्रेरित किया। इस पोस्ट में जो प्रस्ताव मैंने प्रस्तुत किया है वह आपके वर्तमान टॉप रेटेड समाधान से बेहतर है क्योंकि यह आपको $ http सर्विस कॉल के लिए अपने डेटा ऑब्जेक्ट को पैरामीट्रिजिंग तक सीमित नहीं करता है; यानी मेरे समाधान के साथ आप वास्तविक डेटा ऑब्जेक्ट को $ http.post (), आदि के लिए जारी रख सकते हैं और फिर भी वांछित परिणाम प्राप्त कर सकते हैं।

इसके अलावा, शीर्ष रेटेड उत्तर $ .param () फ़ंक्शन के लिए पृष्ठ में पूर्ण jQuery के शामिल किए जाने पर निर्भर करता है, जबकि मेरा समाधान jQuery अज्ञेयवादी, शुद्ध AngularJS तैयार है।

http://victorblog.com/2012/12/20/make-angularjs-http-service-behave-like-jquery-ajax/

उम्मीद है की यह मदद करेगा।

Comments

विस्तृत ब्लॉग के लिए +1, लेकिन इस तथ्य की आवश्यकता है कि यह भयानक है ...

— iwein

हां, हो सकता है कि दो स्तरों पर भयानक हो: 1) कि AngularJS ने एक वास्तविक तथ्य (हालांकि माना गुमराह) मानक का पालन करने का फैसला किया , और 2) कि PHP (और जो अन्य सर्वर-साइड भाषाओं को जानता है) किसी भी तरह से स्वचालित रूप से एप्लिकेशन / जेनसन का पता नहीं लगाता है इनपुट। : पी

— ईजेकील विक्टर

क्या यह संभव होगा कि कोणीयज स्वचालित रूप से सामग्री के प्रकार के अनुरूप हों और उसी के अनुसार एनकोड करें? क्या यह पूर्वाभास है?

— बजे

मुझे (कई अन्य लोगों की तरह) इस बात का ASP.NETपता चला कि मेरे बैकएंड ने 'मूल रूप से' इसका समर्थन नहीं किया है। यदि आप AngularJS के व्यवहार को बदलना नहीं चाहते हैं (जो मैंने नहीं किया, क्योंकि मेरे API ने JSON को लौटा दिया है, तो इसे JSON भी स्वीकार क्यों नहीं किया है, यह फॉर्म डेटा की तुलना में अधिक लचीला है) आप इसे पढ़ सकते हैं Request.InputStreamऔर फिर इसे किसी भी तरह से संभाल सकते हैं आप यह चाहते हैं। (मैंने dynamicउपयोग में आसानी के लिए इसे deserialize करना चुना ।)

— Aidiakapi

नीच क्योंकि यह एक स्व-निहित जवाब नहीं है । अच्छे जवाब सिर्फ कहीं और लिंक नहीं करते हैं। उत्तर से कैसे : "हमेशा एक महत्वपूर्ण लिंक का सबसे प्रासंगिक हिस्सा उद्धृत करें, यदि लक्ष्य साइट उपलब्ध नहीं है या स्थायी रूप से ऑफ़लाइन हो जाती है।"

— जेम्स

Answer 4

मैंने कुछ अन्य उत्तरों को लिया और कुछ को थोड़ा साफ किया, इस .config()कॉल को अपने app.js में अपने angular.module के अंत में रखा:

.config(['$httpProvider', function ($httpProvider) {
  // Intercept POST requests, convert to standard form encoding
  $httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
  $httpProvider.defaults.transformRequest.unshift(function (data, headersGetter) {
    var key, result = [];

    if (typeof data === "string")
      return data;

    for (key in data) {
      if (data.hasOwnProperty(key))
        result.push(encodeURIComponent(key) + "=" + encodeURIComponent(data[key]));
    }
    return result.join("&");
  });
}]);

Comments

एक आकर्षण की तरह काम करता है - भले ही संसाधन परिभाषा में संलग्न हो।

— काई मेटर्न

उपयोग करने के लिए भी ध्यान रखा गया unshift()ताकि अन्य परिवर्तन बिना रुके रहें। अच्छा कार्य।

— आदित्य एमपी

उत्तम! मेरे लिए ठीक काम किया! दुखद कोणीय मूल रूप से इसका समर्थन नहीं कर रहा है।

— स्पियरला

यह उत्तर शीर्ष पर सही होना चाहिए, अन्य गलत हैं, धन्यवाद दोस्त !!

— जोस इग्नासियो हिता

पुनरावर्ती एन्कोडिंग के बारे में कैसे?

— पेतह

Answer 5

AngularJS v1.4.0 के रूप में, एक अंतर्निहित $httpParamSerializerसेवा है जो डॉक्स पृष्ठ पर सूचीबद्ध नियमों के अनुसार किसी HTTP अनुरोध के एक हिस्से में किसी वस्तु को परिवर्तित करती है ।

इसका उपयोग इस तरह किया जा सकता है:

$http.post('http://example.com', $httpParamSerializer(formDataObj)).
    success(function(data){/* response status 200-299 */}).
    error(function(data){/* response status 400-999 */});

याद रखें कि एक सही फॉर्म पोस्ट के लिए, Content-Typeहेडर को बदलना होगा। सभी POST अनुरोधों के लिए विश्व स्तर पर ऐसा करने के लिए, इस कोड (Albireo के आधे-उत्तर से लिया गया) का उपयोग किया जा सकता है:

$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

केवल वर्तमान पोस्ट के लिए ऐसा करने के लिए, headersअनुरोध-ऑब्जेक्ट की संपत्ति को संशोधित करने की आवश्यकता है:

var req = {
 method: 'POST',
 url: 'http://example.com',
 headers: {
   'Content-Type': 'application/x-www-form-urlencoded'
 },
 data: $httpParamSerializer(formDataObj)
};

$http(req);

Comments

हम कस्टम $ संसाधन कारखाने पर कैसे कर सकते हैं?

— स्टिल लाइफ

नोट: मैं एंगुलर 1.3 से 1.5 तक एक ऐप को अपग्रेड करता हूं। इसने ट्रांसफॉर्मर में हेडर को बदल दिया। किसी कारण से, ऊपर दी गई विधि मेरे लिए काम नहीं करती है, कोणीय यूआरएल-एन्कोडेड स्ट्रिंग के चारों ओर दोहरे उद्धरण जोड़ता है। के साथ हल किया transformRequest: $httpParamSerializer, data: formDataObj। समाधान के लिए धन्यवाद।

— फीलो

Answer 6

आप विश्व स्तर पर व्यवहार को परिभाषित कर सकते हैं:

$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";

इसलिए आपको हर बार इसे फिर से परिभाषित करने की आवश्यकता नहीं है:

$http.post("/handle/post", {
    foo: "FOO",
    bar: "BAR"
}).success(function (data, status, headers, config) {
    // TODO
}).error(function (data, status, headers, config) {
    // TODO
});

Comments

आपका उदाहरण बहुत गलत है ... यह सब आप संशोधित कर रहे हैं हेडर है। डेटा स्वयं अभी भी JSON- एन्कोडेड होगा, और पुराने सर्वरों द्वारा अपठनीय है जो JSON नहीं पढ़ सकते हैं।

— एलेक्स

victorblog.com/2012/12/20/… - यहां एक अच्छा उदाहरण है जहां आप $ http डिफ़ॉल्ट हेडर को ओवरराइड करते हैं, साथ ही ऑब्जेक्ट को क्रमबद्ध रूप डेटा में परिवर्तित करते हैं।

— फेडरिकिको

Answer 7

वर्कअराउंड के रूप में आप बस एप्लिकेशन / जोंस डेटा के लिए POST रिस्पांस प्राप्त करने वाला कोड बना सकते हैं। PHP के लिए मैंने नीचे दिए गए कोड को जोड़ा, जिससे मुझे POST करने की अनुमति फॉर्म-एन्कोडेड या JSON में मिली।

//handles JSON posted arguments and stuffs them into $_POST
//angular's $http makes JSON posts (not normal "form encoded")
$content_type_args = explode(';', $_SERVER['CONTENT_TYPE']); //parse content_type string
if ($content_type_args[0] == 'application/json')
  $_POST = json_decode(file_get_contents('php://input'),true);

//now continue to reference $_POST vars as usual

Comments

यह सर्वर साइड फिक्स के अच्छे उदाहरणों में से एक है, क्योंकि इस मुद्दे पर असली समस्या सर्वर साइड API पर है .. ब्रावो

— विग्नेश

Answer 8

ये जवाब पागल ओवरकिल की तरह दिखते हैं, कभी-कभी, सरल बस बेहतर होता है:

$http.post(loginUrl, "userName=" + encodeURIComponent(email) +
                     "&password=" + encodeURIComponent(password) +
                     "&grant_type=password"
).success(function (data) {
//...

Comments

मेरे लिए, मुझे अभी भी हेडर निर्दिष्ट करना था Content-Typeऔर इसे सेट करना था application/x-www-form-urlencoded।

— विक्टर रामोस

Answer 9

आप नीचे दिए गए समाधान के साथ कोशिश कर सकते हैं

$http({
        method: 'POST',
        url: url-post,
        data: data-post-object-json,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'},
        transformRequest: function(obj) {
            var str = [];
            for (var key in obj) {
                if (obj[key] instanceof Array) {
                    for(var idx in obj[key]){
                        var subObj = obj[key][idx];
                        for(var subKey in subObj){
                            str.push(encodeURIComponent(key) + "[" + idx + "][" + encodeURIComponent(subKey) + "]=" + encodeURIComponent(subObj[subKey]));
                        }
                    }
                }
                else {
                    str.push(encodeURIComponent(key) + "=" + encodeURIComponent(obj[key]));
                }
            }
            return str.join("&");
        }
    }).success(function(response) {
          /* Do something */
        });

Answer 10

पोस्ट के लिए एक एडाप्टर सेवा बनाएं:

services.service('Http', function ($http) {

    var self = this

    this.post = function (url, data) {
        return $http({
            method: 'POST',
            url: url,
            data: $.param(data),
            headers: {'Content-Type': 'application/x-www-form-urlencoded'}
        })
    }

}) 

इसे अपने नियंत्रकों में या जो भी उपयोग करें:

ctrls.controller('PersonCtrl', function (Http /* our service */) {
    var self = this
    self.user = {name: "Ozgur", eMail: null}

    self.register = function () {
        Http.post('/user/register', self.user).then(function (r) {
            //response
            console.log(r)
        })
    }

})

Comments

$ .पारम केवल jquery abi में। jsfiddle.net/4n9fao9q/27 $ httpParamSerializer Angularjs के बराबर है।

— डेक्सटर

Answer 11

एक बहुत अच्छा ट्यूटोरियल है जो इस और अन्य संबंधित सामानों पर जाता है - अजेक्स फॉर्म सबमिट करना: एंगुलरजेएस वे ।

मूल रूप से, आपको यह इंगित करने के लिए POST अनुरोध के शीर्षलेख को सेट करने की आवश्यकता है कि आप URL एनकोडेड स्ट्रिंग के रूप में फॉर्म डेटा भेज रहे हैं, और डेटा को उसी प्रारूप में भेजने के लिए सेट करें।

$http({
  method  : 'POST',
  url     : 'url',
  data    : $.param(xsrf),  // pass in data as strings
  headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  // set the headers so angular passing info as form data (not request payload)
});

ध्यान दें कि डेटा को एक स्ट्रिंग में अनुक्रमित करने के लिए jQuery के परम () हेल्पर फ़ंक्शन का उपयोग यहां किया जाता है, लेकिन आप इसे jQuery का उपयोग नहीं करते हुए मैन्युअल रूप से भी कर सकते हैं।

Comments

मध्यस्थों ने केवल मेरे पिछले उत्तर को हटा दिया क्योंकि मैंने लिंक में वर्णित वास्तव में कार्यान्वयन का विवरण प्रदान नहीं किया था। यह बेहतर होता अगर वे इसके बजाय मुझे पहले विवरण देने के लिए कहते, इसे हटाने के बजाय, जैसा कि मैं पहले से ही इस उत्तर में देखे गए विवरण प्रदान करने के लिए अपना उत्तर संपादित कर रहा था!

— रॉबिनमित्रा

$.paramजादू है। जो jQuery + AngularJS आधारित अनुप्रयोग है के लिए सही समाधान।

— दशतिनजद

Answer 12

var fd = new FormData();
    fd.append('file', file);
    $http.post(uploadUrl, fd, {
        transformRequest: angular.identity,
        headers: {'Content-Type': undefined}
    })
    .success(function(){
    })
    .error(function(){
    });

कृपया जांच लें! https://uncorkedstudios.com/blog/multipartformdata-file-upload-with-angularjs

Comments

यह आज तक मान्य है।

— caot

Answer 13

Symfony2 उपयोगकर्ताओं के लिए:

यदि आप इसके लिए अपनी जावास्क्रिप्ट में कुछ भी नहीं बदलना चाहते हैं तो आप इन संशोधनों को सिम्फनी ऐप में कर सकते हैं:

एक वर्ग बनाएँ जो सिम्फनी \ घटक \ HttpFoundation \ Request वर्ग का विस्तार करता है:

<?php

namespace Acme\Test\MyRequest;

use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\ParameterBag;

class MyRequest extends Request{


/**
* Override and extend the createFromGlobals function.
* 
* 
*
* @return Request A new request
*
* @api
*/
public static function createFromGlobals()
{
  // Get what we would get from the parent
  $request = parent::createFromGlobals();

  // Add the handling for 'application/json' content type.
  if(0 === strpos($request->headers->get('CONTENT_TYPE'), 'application/json')){

    // The json is in the content
    $cont = $request->getContent();

    $json = json_decode($cont);

    // ParameterBag must be an Array.
    if(is_object($json)) {
      $json = (array) $json;
  }
  $request->request = new ParameterBag($json);

}

return $request;

}

}

अब आप app_dev.php (या आपके द्वारा उपयोग की जाने वाली कोई भी अनुक्रमणिका फ़ाइल) में कक्षा का उपयोग करें

// web/app_dev.php

$kernel = new AppKernel('dev', true);
// $kernel->loadClassCache();
$request = ForumBundleRequest::createFromGlobals();

// use your class instead
// $request = Request::createFromGlobals();
$response = $kernel->handle($request);
$response->send();
$kernel->terminate($request, $response);

Comments

यह वास्तव में मेरे लिए उपयोगी था, नया createFromGlobals अब पूरी तरह से काम कर रहा है। मुझे नहीं पता कि आपको एक गिरावट क्यों मिली, लेकिन मैंने इसे हटा दिया।

— रिचर्ड

Answer 14

बस सेट-कंटेंट-टाइप ही पर्याप्त नहीं है, url फॉर्म डेटा को भेजने से पहले। $http.post(url, jQuery.param(data))

Answer 15

वर्तमान में मैं निम्नलिखित समाधान का उपयोग कर रहा हूं जो मुझे AngularJS google group में मिला है।

$ http
.post ('/ echo / json /', 'json =' + encodeURIComponent (angular.toJson (data)), {
    हेडर: {
        'सामग्री-प्रकार': 'आवेदन / x-www-form-urlencoded; charset = UTF-8 '
    }
})। सफलता (फ़ंक्शन (डेटा) {
    $ गुंजाइश .डेटा = डेटा;
});

ध्यान दें कि यदि आप PHP का उपयोग कर रहे हैं, तो आपको इसे Request::createFromGlobals()पढ़ने के लिए Symfony 2 HTTP घटक जैसे कुछ का उपयोग करना होगा, क्योंकि $ _POST अपने आप लोड नहीं होगा।

Answer 16

AngularJS इसे सही कर रहा है क्योंकि यह http-request शीर्ष लेख के अंदर निम्नलिखित सामग्री-प्रकार कर रहा है:

Content-Type: application/json

यदि आप मेरी तरह php के साथ जा रहे हैं, या यहां तक ​​कि Symfony2 के साथ भी आप बस वर्णित के लिए json मानक के लिए अपने सर्वर संगतता का विस्तार कर सकते हैं: http://silex.sensiolabs.org/doc/cookbook/json_request_body.html

Symfony2 तरीका (जैसे आपके DefaultController के अंदर):

$request = $this->getRequest();
if (0 === strpos($request->headers->get('Content-Type'), 'application/json')) {
    $data = json_decode($request->getContent(), true);
    $request->request->replace(is_array($data) ? $data : array());
}
var_dump($request->request->all());

इसका फायदा यह होगा, कि आपको jQuery param का उपयोग करने की आवश्यकता नहीं है और आप AngularJS को इस तरह के अनुरोध करने के अपने मूल तरीके का उपयोग कर सकते हैं।

Answer 17

पूर्ण उत्तर (कोणीय 1.4 के बाद से)। आपको डे डिपेंडेंसी $ httpParamSerializer शामिल करने की आवश्यकता है

var res = $resource(serverUrl + 'Token', { }, {
                save: { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded' } }
            });

            res.save({ }, $httpParamSerializer({ param1: 'sdsd', param2: 'sdsd' }), function (response) {

            }, function (error) { 

            });

Answer 18

आपके एप्लिकेशन कॉन्फिग में -

$httpProvider.defaults.transformRequest = function (data) {
        if (data === undefined)
            return data;
        var clonedData = $.extend(true, {}, data);
        for (var property in clonedData)
            if (property.substr(0, 1) == '$')
                delete clonedData[property];

        return $.param(clonedData);
    };

आपके संसाधन अनुरोध के साथ -

 headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            }

Answer 19

यह प्रत्यक्ष उत्तर नहीं है, बल्कि थोड़ी अलग डिज़ाइन दिशा है:

डेटा को प्रपत्र के रूप में पोस्ट न करें, लेकिन JSON ऑब्जेक्ट के रूप में सर्वर-साइड ऑब्जेक्ट पर सीधे मैप किया जा सकता है, या RIS शैली संस्करण चर का उपयोग कर सकता है

अब मुझे पता है कि न तो विकल्प आपके मामले में उपयुक्त हो सकता है क्योंकि आप एक एक्सएसआरएफ कुंजी पारित करने की कोशिश कर रहे हैं। इसे इस तरह एक पथ चर में मैप करना एक भयानक डिजाइन है:

http://www.someexample.com/xsrf/{xsrfKey}

क्योंकि स्वभाव से आप xsrf कुंजी को अन्य पथ में भी पास करना चाहेंगे /login,/book-appointment आदि। और आप अपने सुंदर URL को गड़बड़ नहीं करना चाहते हैं

दिलचस्प रूप से इसे एक ऑब्जेक्ट फ़ील्ड के रूप में जोड़ना उचित नहीं है, क्योंकि अब प्रत्येक json ऑब्जेक्ट पर आप उस सर्वर से गुजरते हैं जिसे आपको फ़ील्ड जोड़ना होगा

{
  appointmentId : 23,
  name : 'Joe Citizen',
  xsrf : '...'
}

आप निश्चित रूप से अपने सर्वर-साइड वर्ग पर एक और फ़ील्ड जोड़ना नहीं चाहते हैं, जिसका डोमेन ऑब्जेक्ट के साथ सीधा अर्थ संबंधी जुड़ाव नहीं है।

मेरी राय में आपकी xsrf कुंजी को पास करने का सबसे अच्छा तरीका HTTP हेडर है। कई xsrf सुरक्षा सर्वर-साइड वेब फ्रेमवर्क लाइब्रेरी इसका समर्थन करती है। उदाहरण के लिए जावा स्प्रिंग में, आप X-CSRF-TOKENहेडर का उपयोग करके इसे पास कर सकते हैं ।

जेएस ऑब्जेक्ट को यूआई ऑब्जेक्ट को बांधने की कोणीय क्षमता की उत्कृष्ट क्षमता का मतलब है कि हम सभी को एक साथ पोस्ट करने के अभ्यास से छुटकारा पा सकते हैं, और इसके बजाय JSON पोस्ट कर सकते हैं। JSON को सर्वर-साइड ऑब्जेक्ट में आसानी से डी-सीरीज़ किया जा सकता है और मैप, सरणियों, नेस्टेड ऑब्जेक्ट्स आदि जैसे जटिल डेटा संरचनाओं का समर्थन कर सकता है।

आप फार्म पेलोड में सरणी कैसे पोस्ट करते हैं? शायद इस तरह:

shopLocation=downtown&daysOpen=Monday&daysOpen=Tuesday&daysOpen=Wednesday

या यह:

shopLocation=downtwon&daysOpen=Monday,Tuesday,Wednesday

दोनों ही घटिया डिज़ाइन ।।

Answer 20

यह वही है जो मैं अपनी जरूरत के लिए कर रहा हूं, जहां मुझे लॉग डेटा को फॉर्म डेटा के रूप में एपीआई को भेजने की आवश्यकता है और जावास्क्रिप्ट ऑब्जेक्ट (उपयोगकर्ता डेटा) URL एनकोड किए गए डेटा के लिए स्वचालित रूप से परिवर्तित हो रहा है।

        var deferred = $q.defer();
        $http({
            method: 'POST',
            url: apiserver + '/authenticate',
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
            transformRequest: function (obj) {
                var str = [];
                for (var p in obj)
                    str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
                return str.join("&");
            },
            data: userData
        }).success(function (response) {
            //logics
            deferred.resolve(response);
        }).error(function (err, status) {
           deferred.reject(err);
        });

यह मेरा यूजरडेट कैसा है

var userData = {
                grant_type: 'password',
                username: loginData.userName,
                password: loginData.password
            }

Answer 21

जब आपको अपनी पतली चीज़ बदलनी हो तो संपत्ति "पैरामस" का उपयोग "डेटा" के बजाय करें जब आप अपना $ http ऑब्जेक्ट बनाएँ:

$http({
   method: 'POST',
   url: serviceUrl + '/ClientUpdate',
   params: { LangUserId: userId, clientJSON: clients[i] },
})

ग्राहकों के ऊपर के उदाहरण में [i] सिर्फ JSON ऑब्जेक्ट है (किसी भी तरह से क्रमबद्ध नहीं)। यदि आप "डेटा" के बजाय "परम" का उपयोग करते हैं तो कोणीय आपके लिए $ httpParamSerializer: https://docs.angularjs.org/api/ng/service/ $ httpParamSerializer का उपयोग करके आपके लिए ऑब्जेक्ट को अनुक्रमित करेगा।

Comments

डेटा के बजाय params का उपयोग करके, Angular अनुरोध निकाय के बजाय URL पैरामीटर में डेटा रखता है। फॉर्म पोस्ट से यह अपेक्षित नहीं है।

— cmenning

Answer 22

AngularJS $httpसेवा का उपयोग करें और इसकी postविधि का उपयोग करें या $httpफ़ंक्शन को कॉन्फ़िगर करें।