How can I send JSON data to ASP Server using AJAX?

I have a website using ASP.NET that needs to retrieve some data from CloudKit. I am using CloudKit JS and I am retrieving a record from CloudKit and sending the data to the server from my JavaScript using C#. I am able to turn the JSON object of the retrieved record into a string using JSON.stringify(record);, but I am unable to send it to the server using AJAX. Here is my code for sending the data using AJAX:

function afterRecordLoaded(record) {
            var decodedRecord = JSON.stringify(record);
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.open("POST", "/receive?type=specific&" + "data=" + decodedRecord, true);
            xmlhttp.setRequestHeader("Content-Type", "application/json");
            xmlhttp.send();
}
afterRecordLoaded(record);

When I go to the console in the Browser Dev Tools, I can perform the request correctly when done manually, but when AJAX does it, it gets an HTTP Error 400. In other words, I can perform the request when I type the URL (with correct parameters) into the address bar, but when the same URL (with the same parameters) is used by AJAX, it doesn’t work and returns an HTTP Error 400.

Here is my C# code for the page that is receiving the request:

    var token = antiforgery.GetAndStoreTokens(HttpContext).RequestToken;

    var type = Request.Query["type"];
    var data = Request.Query["data"];

    if (type == "specific")
    {
        if (data != "")
        {
            PostProcessor.processPostData(data);
        }
        else
        {
            Response.StatusCode = 400;
        }
    }

When doing a simple Google search, I can see that others are experiencing this issue as well, and to get around it, they use an anti-forgery token. I am not sure how to implement anti-forgery tokens if needed. It would be great if anyone has a solution to get rid of the HTTP Error 400, or to implement the anti-forgery token to make the error go away. Sorry if this question is all over the place, or very obvious as I am a beginner in ASP. Thank you.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

may be when you send in console ,data is not empty. while data is empty with XHR in your code, the request then enter asp.net ‘s else expression Response.StatusCode = 400; .

i guess maybe in your code JSON.stringify(record) has some errors to return nothing.

further more, when you use post request, data (the real payload) should not be send like your style as a query parameter, it should be in payload like this.

var decodedRecord = JSON.stringify(record);
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "/receive?type=specific", true);
xmlhttp.setRequestHeader("Content-Type", "application/json");
xmlhttp.send(decodedRecord );

Method 2

The solution is very simple. I was using the format of a GET request, not a POST request. All I had to do was change xmlhttp.open("POST", "/receive?type=specific&" + "data=" + decodedRecord, true); to xmlhttp.open("GET", "/receive?type=specific&" + "data=" + decodedRecord, true);.


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x