javascript - किसी ऑब्जेक्ट के रूप में वेब एपीआई विधि में जेसन पोस्ट डेटा कैसे पास करें?





asp.net-mvc json asp.net-mvc-4 asp.net-web-api (9)


जेएसओएन प्रारूप में स्ट्रिंग प्राप्त करने के लिए JSON.stringify () का उपयोग करें, सुनिश्चित करें कि AJAX कॉल करते समय आप नीचे दिए गए गुणों को पार करते हैं:

  • सामग्री टाइप: 'एप्लिकेशन / जेसन'
  • डेटा टाइप: 'जेसन'

एएसएफ़एक्स वेब एपीआई को AJAX पोस्ट कॉल करने के लिए नीचे दिए गए jquery कोड को दिया गया है:

var product =
    JSON.stringify({
        productGroup: "Fablet",
        productId: 1,
        productName: "Lumia 1525 64 GB",
        sellingPrice: 700
    });

$.ajax({
    URL: 'http://localhost/api/Products',
    type: 'POST',
    contentType: 'application/json',
    dataType: 'json',
    data: product,
    success: function (data, status, xhr) {
        alert('Success!');
    },
    error: function (xhr, status, error) {
        alert('Update Error occurred - ' + error);
    }
});

एएसपी.नेट एमवीसी 4 वेब एपीआई एप्लिकेशन ग्राहक को बचाने के लिए पोस्ट विधि को परिभाषित करता है। POST अनुरोध निकाय में ग्राहक जेसन प्रारूप में पारित किया गया है। पोस्ट विधि में ग्राहक पैरामीटर में गुणों के लिए शून्य मान होते हैं।

इसे कैसे ठीक करें ताकि पोस्ट किया गया डेटा ग्राहक ऑब्जेक्ट के रूप में पारित हो जाए?

यदि संभव हो तो सामग्री-प्रकार: एप्लिकेशन / एक्स-www-form-urlencoded का उपयोग किया जाना चाहिए क्योंकि मुझे नहीं पता कि जावास्क्रिप्ट विधि में इसे कैसे बदलना है, जो पोस्ट फॉर्म हैं।

नियंत्रक:

public class CustomersController : ApiController {

  public object Post([FromBody] Customer customer)
        {
            return Request.CreateResponse(HttpStatusCode.OK,
            new
            {
                customer = customer
            });
        }
    }
}

public class Customer
    {
        public string company_name { get; set; }
        public string contact_name { get; set; }
     }

निवेदन:

POST http://localhost:52216/api/customers HTTP/1.1
Accept: application/json, text/javascript, */*; q=0.01
X-Requested-With: XMLHttpRequest
Content-Type: application/x-www-form-urlencoded; charset=UTF-8

{"contact_name":"sdfsd","company_name":"ssssd"}



माइक्रोसॉफ्ट ने ऐसा करने का एक अच्छा उदाहरण दिया:

https://docs.microsoft.com/en-us/aspnet/web-api/overview/advanced/sending-html-form-data-part-1

पहले अनुरोध को मान्य करें

if (ModelState.IsValid)

और धारावाहिक डेटा का उपयोग करने के बजाय।

Content = new StringContent(update.Status)

यहां 'स्थिति' जटिल प्रकार में एक फ़ील्ड है। Serializing .NET द्वारा किया जाता है, इसके बारे में चिंता करने की कोई आवश्यकता नहीं है।




1) अपने ग्राहक पक्ष में आप नीचे स्ट्रिंग में http.post अनुरोध भेज सकते हैं

var IndexInfo = JSON.stringify(this.scope.IndexTree);
this.$http.post('../../../api/EvaluationProcess/InsertEvaluationProcessInputType', "'" + IndexInfo + "'" ).then((response: any) => {}

2) फिर अपने वेब एपीआई नियंत्रक में आप इसे deserialize कर सकते हैं

public ApiResponce InsertEvaluationProcessInputType([FromBody]string IndexInfo)
    {
var des = (ApiReceivedListOfObjects<TempDistributedIndex>)Newtonsoft.Json.JsonConvert.DeserializeObject(DecryptedProcessInfo, typeof(ApiReceivedListOfObjects<TempDistributedIndex>));}

3) आपकी ApiReceivedListOfObjects वर्ग नीचे की तरह होना चाहिए

public class ApiReceivedListOfObjects<T>
    {
        public List<T> element { get; set; }

    }

4) सुनिश्चित करें कि आपकी धारावाहिक स्ट्रिंग (इंडेक्सइन्फो यहां) नीचे की संरचना की तरह बन जाती है JsonConvert.DeserializeObject कमांड चरण 2 में

var resp = @"
    {
        ""element"": [
        {
            ""A"": ""A Jones"",
            ""B"": ""500015763""
        },
        {
            ""A"": ""B Smith"",
            ""B"": ""504986213""
        },
        {
            ""A"": ""C Brown"",
            ""B"": ""509034361""
        }
        ]
    }";



वेबपी में पोस्ट के साथ काम करना मुश्किल हो सकता है! पहले से ही सही उत्तर में जोड़ना चाहते हैं ..

जीईटी से निपटने के रूप में विशेष रूप से POST पर ध्यान केंद्रित करेंगे। मुझे नहीं लगता कि कई वेबपिस के साथ जीईटी के साथ किसी समस्या को हल करने के लिए चारों ओर खोज करेंगे। वैसे भी ..

यदि आपका प्रश्न है - एमवीसी वेब एपीआई में, कैसे - सामान्य जेनेरिक HTTP क्रियाओं के अलावा कस्टम एक्शन विधि नामों का उपयोग करें? - एकाधिक पोस्ट करें? - कई सरल प्रकार पोस्ट करें? - jQuery के माध्यम से पोस्ट जटिल प्रकार?

फिर निम्नलिखित समाधान मदद कर सकते हैं:

सबसे पहले, वेब एपीआई में कस्टम एक्शन विधियों का उपयोग करने के लिए, एक वेब एपीआई रूट जोड़ें:

public static void Register(HttpConfiguration config)
{
    config.Routes.MapHttpRoute(
        name: "ActionApi",
        routeTemplate: "api/{controller}/{action}");
}

और फिर आप क्रिया विधियां बना सकते हैं जैसे:

[HttpPost]
public string TestMethod([FromBody]string value)
{
    return "Hello from http post web api controller: " + value;
}

अब, अपने ब्राउज़र कंसोल से निम्नलिखित jQuery को आग

$.ajax({
    type: 'POST',
    url: 'http://localhost:33649/api/TestApi/TestMethod',
    data: {'':'hello'},
    contentType: 'application/x-www-form-urlencoded',
    dataType: 'json',
    success: function(data){ console.log(data) }
});

दूसरा, एकाधिक पदों को करने के लिए, यह आसान है, कई क्रिया विधियों को बनाएं और [HttpPost] attrib के साथ सजाने के लिए। कस्टम नाम असाइन करने के लिए [ActionName ("MyAction")] का उपयोग करें, आदि नीचे चौथे बिंदु पर jQuery पर आ जाएगा

तीसरा, सबसे पहले, एक ही कार्रवाई में एकाधिक सरल प्रकार पोस्ट करना संभव नहीं है। इसके अलावा, एक साधारण प्रारूप भी पोस्ट करने के लिए एक विशेष प्रारूप है (क्वेरी स्ट्रिंग या आरईएसटी शैली में पैरामीटर को पार करने के अलावा)। यह वह बिंदु था जिसने मुझे अपने ग्राहकों को आराम क्लाइंट (जैसे फिडलर और क्रोम के उन्नत आरईएसटी क्लाइंट एक्सटेंशन) के साथ टक्कर लगी और लगभग 5 घंटे तक वेब पर शिकार किया, अंत में, निम्नलिखित यूआरएल मदद की साबित हुई। लिंक के लिए प्रासंगिक सामग्री उद्धृत कर सकते हैं मृत हो सकता है!

Content-Type: application/x-www-form-urlencoded
in the request header and add a = before the JSON statement:
={"Name":"Turbo Tina","Email":"[email protected]"}

पीएस: असाधारण वाक्यविन्यास नोटिस ?

http://forums.asp.net/t/1883467.aspx?The+received+value+is+null+when+I+try+to+Post+to+my+Web+Api

वैसे भी, हमें उस कहानी को खत्म करने दें। आगे बढ़ते रहना:

चौथा, jQuery के माध्यम से जटिल प्रकार पोस्ट करना , संभोग, $ .ajax () तुरंत भूमिका में आ जाएगा:

आइए हम कहें कि एक्शन विधि किसी व्यक्ति ऑब्जेक्ट को स्वीकार करती है जिसमें एक आईडी और नाम होता है। तो, जावास्क्रिप्ट से:

var person = { PersonId:1, Name:"James" }
$.ajax({
    type: 'POST',
    url: 'http://mydomain/api/TestApi/TestMethod',
    data: JSON.stringify(person),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    success: function(data){ console.log(data) }
});

और कार्रवाई इस तरह दिखेगी:

[HttpPost]
public string TestMethod(Person person)
{
    return "Hello from http post web api controller: " + person.Name;
}

उपरोक्त सभी, मेरे लिए काम किया !! चीयर्स!




सुनिश्चित करें कि आपकी वेबएपीआई सेवा एक संरचना के साथ दृढ़ता से टाइप की गई वस्तु की अपेक्षा कर रही है जो आपके द्वारा पारित JSON से मेल खाती है। और सुनिश्चित करें कि आप JSON को स्ट्रिंग करते हैं जिसे आप पोस्ट कर रहे हैं।

यहां मेरी जावास्क्रिप्ट है (AngluarJS का उपयोग करके):

$scope.updateUserActivity = function (_objuserActivity) {
        $http
        ({
            method: 'post',
            url: 'your url here',
            headers: { 'Content-Type': 'application/json'},
            data: JSON.stringify(_objuserActivity)
        })
        .then(function (response)
        {
            alert("success");
        })
        .catch(function (response)
        {
            alert("failure");
        })
        .finally(function ()
        {
        });

और यहां मेरा वेबएपीआई नियंत्रक है:

[HttpPost]
[AcceptVerbs("POST")]
public string POSTMe([FromBody]Models.UserActivity _activity)
{
    return "hello";
}



संपादित करें : 31/10/2017

एक ही कोड / दृष्टिकोण Asp.Net कोर 2.0 के लिए भी काम करेगा। मुख्य अंतर यह है कि, एएसपीनेट कोर में, दोनों वेब एपीआई नियंत्रक और एमवीसी नियंत्रक एकल नियंत्रक मॉडल में एक साथ विलय कर रहे हैं। तो आपका रिटर्न टाइप IActionResult या इसके कार्यान्वयन में से एक हो सकता है (उदा: OkObjectResult )

उपयोग

contentType:"application/json"

जब आप इसे भेजते हैं तो इसे JSON स्ट्रिंग में कनवर्ट करने के लिए JSON.stringify विधि का उपयोग करने की आवश्यकता है,

और मॉडल बाइंडर आपके क्लास ऑब्जेक्ट में जेसन डेटा को बांध देगा।

नीचे दिया गया कोड ठीक काम करेगा (परीक्षण किया गया)

$(function () {
    var customer = {contact_name :"Scott",company_name:"HP"};
    $.ajax({
        type: "POST",
        data :JSON.stringify(customer),
        url: "api/Customer",
        contentType: "application/json"
    });
});

परिणाम

contentType संपत्ति सर्वर को बताती है कि हम JSON प्रारूप में डेटा भेज रहे हैं। चूंकि हमने एक JSON डेटा संरचना भेजी है, मॉडल बाध्यकारी ठीक से होगा।

यदि आप AJAX अनुरोध के शीर्षलेखों का निरीक्षण करते हैं, तो आप देख सकते हैं कि Content-Type मान application/json रूप में सेट किया गया है।

यदि आप सामग्री निर्दिष्ट नहीं करते हैं तो स्पष्ट रूप से टाइप करें, यह डिफ़ॉल्ट सामग्री प्रकार का उपयोग करेगा जो application/x-www-form-urlencoded;

टिप्पणियों में उठाए गए अन्य संभावित मुद्दों को हल करने के लिए नवंबर 2015 को संपादित करें

एक जटिल वस्तु पोस्ट करना

आइए मान लें कि आपके पास एक जटिल दृश्य मॉडल क्लास है जो इस तरह आपके वेब एपीआई एक्शन विधि पैरामीटर के रूप में है

public class CreateUserViewModel
{
   public int Id {set;get;}
   public string Name {set;get;}  
   public List<TagViewModel> Tags {set;get;}
}
public class TagViewModel
{
  public int Id {set;get;}
  public string Code {set;get;}
}

और आपका वेब एपीआई एंड पॉइंट जैसा है

public class ProductController : Controller
{
    [HttpPost]
    public CreateUserViewMode Save([FromBody] CreateUserViewModel m)
    {
        // I am just returning the posted model as it is. 
        // You may do other stuff and return different response.
        // Ex : missileService.LaunchMissile(m);
        return m;
    }
}

इस लेखन के समय, एएसपी.नेट एमवीसी 6 नवीनतम स्थिर संस्करण है और एमवीसी 6 में, दोनों वेब एपीआई नियंत्रक और एमवीसी नियंत्रक Microsoft.AspNet.Mvc.Controller बेस क्लास से विरासत में हैं।

क्लाइंट साइड से विधि को डेटा भेजने के लिए, नीचे दिए गए कोड को ठीक काम करना चाहिए

//Build an object which matches the structure of our view model class
var model = {
    Name: "Shyju",
    Id: 123,
    Tags: [{ Id: 12, Code: "C" }, { Id: 33, Code: "Swift" }]
};

$.ajax({
    type: "POST",
    data: JSON.stringify(model),
    url: "../product/save",
    contentType: "application/json"
}).done(function(res) {       
    console.log('res', res);
    // Do something with the result :)
});

कुछ गुणों के लिए मॉडल बाध्यकारी काम करता है, लेकिन सभी नहीं! क्यूं कर ?

यदि आप [FromBody] विशेषता के साथ वेब एपीआई विधि पैरामीटर को सजाने नहीं करते हैं

[HttpPost]
public CreateUserViewModel Save(CreateUserViewModel m)
{
    return m;
}

और सामग्री निर्दिष्ट करने के बिना मॉडल (कच्चे जावास्क्रिप्ट ऑब्जेक्ट, जेएसओएन प्रारूप में नहीं) भेजें संपत्ति प्रकार टाइप करें

$.ajax({
    type: "POST",
    data: model,
    url: "../product/save"
}).done(function (res) {
     console.log('res', res);
});

मॉडल बाइंडिंग मॉडल पर फ्लैट गुणों के लिए काम करेगी, न कि गुण जहां जटिल / अन्य प्रकार है। हमारे मामले में, Id और Name गुण पैरामीटर m लिए ठीक से बाध्य होंगे, लेकिन Tags संपत्ति एक खाली सूची होगी।

यदि आप छोटे संस्करण, $.post का उपयोग कर रहे हैं, तो एक ही समस्या तब होगी जब अनुरोध भेजते समय डिफ़ॉल्ट सामग्री-प्रकार का उपयोग किया जाएगा।

$.post("../product/save", model, function (res) {
    //res contains the markup returned by the partial view
    console.log('res', res);
});



जेएसएल प्रारूप में डेटा वापस करने के लिए कोड के बाद, xml -Web API 2 के बजाय: -

Global.asax फ़ाइल में निम्न पंक्ति डालें

GlobalConfiguration.Configuration.Formatters.JsonFormatter.SerializerSettings.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore;
        GlobalConfiguration.Configuration.Formatters.Remove(GlobalConfiguration.Configuration.Formatters.XmlFormatter);



मैं बस इसके साथ खेल रहा हूं और एक अजीब परिणाम खोजा है। मान लें कि आपके वर्ग पर सी # में सार्वजनिक गुण हैं:

public class Customer
{
    public string contact_name;
    public string company_name;
}

तो आपको शेजुजू द्वारा सुझाए गए JSON.stringify चाल को करना होगा और इसे इस तरह कॉल करें:

var customer = {contact_name :"Scott",company_name:"HP"};
$.ajax({
    type: "POST",
    data :JSON.stringify(customer),
    url: "api/Customer",
    contentType: "application/json"
});

हालांकि, अगर आप अपनी कक्षा में गेटर्स और सेटर्स को इस तरह परिभाषित करते हैं:

public class Customer
{
    public string contact_name { get; set; }
    public string company_name { get; set; }
}

तो आप इसे और अधिक आसानी से कॉल कर सकते हैं:

$.ajax({
    type: "POST",
    data :customer,
    url: "api/Customer"
});

यह HTTP शीर्षलेख का उपयोग करता है:

Content-Type:application/x-www-form-urlencoded

मुझे पूरा यकीन नहीं है कि यहां क्या हो रहा है लेकिन यह ढांचे में एक बग (फीचर?) जैसा दिखता है। संभवतः विभिन्न बाध्यकारी विधियां अलग-अलग "एडेप्टर" को कॉल कर रही हैं, और एप्लिकेशन / जेसन के लिए एडाप्टर सार्वजनिक गुणों के साथ काम करता है, फॉर्म एन्कोडेड डेटा के लिए एक नहीं है।

मुझे नहीं पता कि यद्यपि सर्वश्रेष्ठ अभ्यास माना जाएगा।




यदि आप npm और node.js का उपयोग करते हैं, तो आप npm install -g json कर सकते हैं और फिर npm install -g json माध्यम से कमांड पाइप कर सकते हैं। सभी विकल्पों को पाने के लिए json -h करें। यह विशिष्ट फ़ील्ड भी खींच सकता है और आउटपुट को -i साथ रंगीन कर सकता है।

curl -s http://search.twitter.com/search.json?q=node.js | json




javascript asp.net-mvc json asp.net-mvc-4 asp.net-web-api