JavaScript/jQuery：将多个参数传递给 API 中的 POST 请求答案

【问题标题】：JavaScript/jQuery: Passing multiple parameters to a POST request in an APIJavaScript/jQuery：将多个参数传递给 API 中的 POST 请求
【发布时间】：2019-08-03 15:53:14
【问题描述】：

我在管理新项目的 API 请求时遇到了一些麻烦。我正在尝试练习发出 POST 请求，并且我想在一个 POST 中传递多个参数。到目前为止，我已经尝试过创建一个 for 循环，该循环遍历一个数组以发出多个请求，但这似乎不起作用。我之前处理过简单的 GET 请求，但我似乎无法在不重写整个内容的情况下将多个参数传递给帖子。

这是我目前所拥有的：

let URL = "www.exampleapi.com";

这是我正在使用的数组，它们应该是狗窝里的狗。

let dogArray = [
{"id": 1,
"name": "Max" },
{"id": 2,
"name": "Jack"},
{"id": 3,
"name": "Bones" }
];

狗所在的狗窝当前的 id 为 777

let kennelId = 777;

此 API 的 POST 请求需要 kennelId 和 dogId (dogArray.id)，所以我想编写一个函数，循环遍历 dogArray 并记录各个 id。

function getDogsInKennel(kennelId, dogArray) {

for (let i = 0; i < dogArray.length; i++) {
        //the API would assign a different dogId every time it looped through
        dogId = dogArray[i].id;
    }

fetch(URL, {
        method: 'POST',
        body: JSON.stringify(({ dogId: dogId, kennelId: kennelId })),
        headers:{
            'Content-Type': 'application/json'
        }
    }).then(result => result.json())
}

getDogsInKennel(kennelId, dogArray);

如您所知，此方法行不通。我应该放弃整个函数并尝试其他方法，还是可以重写它以使用同一个数组进行多个 POST 调用？

【问题讨论】：

这可能很明显，但请确保dogId 和kennelId 的类型是正确的类型（如数字、字符串、对象等）。也看看$.post。这对你来说可能更容易（我认为）
你不认为你的获取代码应该在循环内吗？

标签： javascript jquery json post request

【解决方案1】：

我看到的主要问题是您没有将代码放入 POST 的 for 外观中，因此它只会 POST一次，使用 for 循环分配的最后一个 dogId

此外，在将结果转换为 JSON 后，您不会对返回的数据执行任何操作。如果您查看 fetch 文档 here，您可以看到您需要添加另一个 .then 来处理返回的值。所以你最终会为你的函数得到更多类似的东西：

function getDogsInKennel(kennelId, dogArray) {

for (let i = 0; i < dogArray.length; i++) {
    dogId = dogArray[i].id;

    fetch(URL, {
      method: 'POST',
      body: JSON.stringify(({ dogId: dogId, kennelId: kennelId })),
      headers:{
        'Content-Type': 'application/json'
      }
    }).then(result => result.json())
    .then((data) => {
      // Process the result here 
    })
}

.then 仅在您对结果执行某些操作时才需要，例如处理成功消息/状态。

我也不确定您是否打算使用 Promise 来执行此操作，fetch 方法是基于 Promise 的。 $.post 可以在 jQuery 中使用（more about that here）

【讨论】：

【解决方案2】：

希望这会有所帮助：

function getDogsInKennel(kennelId, dogArray) {
let dogIds = []
for (let i = 0; i < dogArray.length; i++) {
        dogIds.push(dogArray[i].id);
    }

fetch(URL, {
        method: 'POST',
        body: JSON.stringify(({ dogId: dogIds, kennelId: kennelId })),
        headers:{
            'Content-Type': 'application/json'
        }
    }).then(result => result.json()).then((data) => {
      console.log(data)
    })
}

getDogsInKennel(kennelId, dogArray);

【讨论】：