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

Posted 2023-05-08

【中文标题】JavaScript/jQuery：将多个参数传递给 API 中的 POST 请求

【英文标题】：JavaScript/jQuery: Passing multiple parameters to a POST request in an API

【发布时间】：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。这对你来说可能更容易（我认为）

你不认为你的获取代码应该在循环内吗？

【参考方案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);