Имея массив объектов javascript в качестве параметра вызова ajax, без jquery?

Question

Я пытаюсь отправить массив объектов JavaScript на мой контроллер ASP.Net MVC без использования jQuery .У меня есть простой массив объектов JavaScript, подобных этому ...

var data = [];

data.push(new person(1, "David"));
data.push(new person(2, "Karine"));
data.push(new person(2, "Annie"));
...etc

function person(_id, _name) {
    this.id = _id;
    this.name = _name;
}

... и я хотел бы иметь его в качестве параметра вызова ajax, например:

var xmlhttp = new XMLHttpRequest();

xmlhttp.onreadystatechange = function () {
    if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {
                    var obj = JSON.parse(xmlhttp.responseText);
                        for (var i = 0; i < obj.length; i++) {                                                
                            if (i == 1) {
                                    alert(obj[i].name);}
                        }
                }
                else {
                    alert('There is an error');
                }
    }
};

xmlhttp.open("GET", "/Home/AjaxTester?id=15&name=dave", true);                             
xmlhttp.send();

Способ, которым я до сих пор находил передачу параметров в вызов ajax, который является ...Home/AjaxTester?id=15&name=dave, прекрасно работает для базовых типов, но я не могу найти способ сделать то же самое с более «сложными» типами.Я открыт для новых способов параметризации моего вызова ajax, если что-нибудь лучше, или даже для нового способа сделать вызов ajax, при условии, что это чистый JavaScript, нет библиотеки, нет фреймворка или чего-либо еще.

Вот мой контроллер MVC ...

public JsonResult AjaxTester(List<Person> _person)
{
    //Whatever Logic...

    return Json(_someObjects);
}

... и класс полученного параметра

public class Person
{
    public int id { get; set; } = 0;      
        public string name { get; set; } = "";

        public Person(int _id, string _name)
        {
            this.id = _id;
            this.name = _name;
        }
}

Answer 1

Вам необходимо изменить метод http с GET на POST.

xmlhttp.open("POST", "/Home/AjaxTester?id=15&name=dave", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(JSON.stringify(data)); 

https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/send

Убедитесь, что вы добавили setRequestHeader.Если вы отправляете объект json, измените заголовок запроса следующим образом:

xhr.setRequestHeader("Content-type", "application/json");

Я бы также рекомендовал удалить параметр запроса и обновить контроллер для принятия этого типа объекта.Вам также может понадобиться добавить [FromBody] рядом с этим параметром.

И ваш контроллер должен быть обновлен аналогично

public JsonResult AjaxTester([FromBody] List<Person> _person)

Answer 2

Перед параметрами необходимо ввести команду FromUri, например:

public JsonResult AjaxTester(FromUri List<Person> _person)