javascript - 如何跨多个页面获取数据?

标签 javascript reactjs redux fetch-api redux-saga

我的项目基于 React、redux、redux-saga、es6,我尝试从这个 API 获取数据:

http://api.dhsprogram.com/rest/dhs/data/BD,2000,2004,2007?&returnFields=CharacteristicLabel,Indicator,IndicatorId,Value&f=json

如您所见,此特定 API 调用显示的数据限制为每页 100 个数据,分布在 40 个页面上。

根据这个答案: http://userforum.dhsprogram.com/index.php?t=msg&th=2086&goto=9591&S=Google 它说您可以将限制扩展到每页最多 3000 个数据。

但是,在某些情况下,我会执行超出该限制的 API 调用,这意味着我不会像这样接收所有数据:

export function fetchMetaData(countryCode: string, surveyYears: string) {
return (fetch('http://api.dhsprogram.com/rest/dhs/data/' + countryCode + ',' + surveyYears + '?returnFields=CharacteristicLabel,Indicator,IndicatorId,Value&f=json')
    .then(response => response.json())
    .then(json => json.Data.map(survey => survey)))
} 

所以我的问题是;鉴于我知道数据的总页数,从该 API 获取所有数据的最佳方法是什么。论坛链接中的答案建议循环访问 API。但是,我找不到正确的语法用法来执行此操作。

我的想法是调用一个 API 来获取总页数。然后使用 redux+redux-saga 将其存储在一个状态中。然后执行一个新请求,将总页数作为参数发送,并获取该总页数次。通过这样做,我无法弄清楚为每次迭代存储数据的语法。

最佳答案

一个可能的解决方案 - 这个想法是先获取页面数量,然后进行适当数量的 API 调用,将每次调用的 promise 推送到一个数组中。然后我们等待所有的 promise 解决,并对返回的数据做一些事情。

async function fetchMetaData() {

    const response = await fetch('apiUrlToGetPageNumber');

    const responses = await Promise.all(
        Array.from(
            Array(resp.data.pagesRequired),
            (_, i) => fetch(`apiUrlToSpecificPage?page=${i}`)
        )
    );
    
    // do something with processedResponses here

}
            
            

关于javascript - 如何跨多个页面获取数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40677764/

相关文章:

javascript - React 组件不会在 window.location 更改时重新渲染

reactjs - MapDispatchToProps 在父组件中导致 Typescript 错误,期望 Actions 作为 props 传递

javascript - 模式 Bootstrap 中的 Codeigniter 表单无法使用 jquery 传递多个复选框

javascript - Reactjs 将子值传递给父级

reactjs - 用inkscape创建图标,用material ui SvgIcon导入

javascript - 有条件地使用 setState 和 redux 状态的正确方法

javascript - 找到位于二次曲线上的两点之间的控制点

javascript - 使用 javascript map 将嵌套数组展开为行

javascript - 单击后禁用提交按钮以防止用户向服务器发送多个请求

javascript - React Hooks : state variable having wrong value in event handlers, 无法输入