Создание POST-запроса к API в JavaScript / jQuery

Question

Я пытался получить POST-запрос от API, и мне не очень-то повезло, что я его протолкнул.Мне интересно, потому что один из параметров, которые я передаю, является массивом объектов.Попытка заставить это работать в течение нескольких часов без удачи.

Эта функция записи требует два параметра, userId и classId.

// вот API, который я вызываю, очевидно, нефактический URL

let apisource = www.exampleapi.com

// это класс

let classId = 12345;

// это ученики в классе

let userArray = [{
  "name": "user1",
  "userId": 101
}, {
  "name": "user2",
  "userId": 102
}]

Я пишу функциюон принимает этот userArray и сопоставляет его с классом, содержащим userIds.

Вот мой вызов API на данный момент:

function getStudents(classId, userArray) {
  $.post(apisource) + "classes"), {
    userId: userArray.userId,
    classId: classId
  }, function(data, status) {
    console.log("students in class loaded)
  }
}

Ничего не загружается.У кого-нибудь есть предложения или указатели на то, что я могу делать неправильно?

Answer 1

Здесь есть несколько проблем.

Например:

userArray.userId

Эта часть кода недействительна. Массивы имеют индексы, а не ключи, например объекты. Это означает, что вы не можете получить доступ к параметру userId, так как вы не определили, к какому индексу он относится.

Учитывая, что в вашем массиве есть два элемента:

let userArray = [
  { name: 'user1', userId: 101 }, // index 0
  { name: 'user2', userId: 102 } // index 1
];

Вам потребуется получить доступ к идентификатору пользователя следующим образом:

userArray[0].userId // Returns 101
userArray[1].userId // Returns 102

Что касается самого запроса, он может выглядеть примерно так:

let apisource = www.exampleapi.com;
let classId = 12345;
$.ajax({  
   type: 'POST',
   url:  apisource,
   data: JSON.stringify({ userId: userArray[0].userId, classId: classId }),
   contentType: "application/json"
});

Answer 2

Похоже, вам нужно реорганизовать вашу реализацию после публикации, чтобы избежать некоторых синтаксических ошибок.

function getStudents(classId, userArray) {
  $.post( apisource + "classes", { 
    userId: userArray.userId,
    classId: classId 
  })
  .done(function( data, status ) {
    console.log("students in class loaded")
  });
}

Answer 3

Прежде всего, вы не можете получить доступ к userId свойства userArray , вам нужно сначала выбрать объект, например, "userArray [0] .userId" или любую логику, чтобы получить один элемент.

С другой стороны, я рекомендовал вам использовать функцию извлечения, проще в использовании и код выглядит более чистым с обещанием.

var apisource = 'https://example.com/';
var data = {}; // the user picked

fetch(apisource , {
  method: 'POST', // or 'PUT'
  body: JSON.stringify(data), // data can be `string` or {object}!
  headers:{
    'Content-Type': 'application/json'
  }
}).then(res => res.json())
.catch(error => console.error('Error:', error))
.then(response => console.log('Success:', response));

источник: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API