JS模拟循环批量请求后台接口
使用async, await处理异步请求。用Promise， setTimeout函数模拟后台接口
<!DOCTYPE html>
<html>
<script type="text/javascript">
var arr=[];
var batchSize = 10;
for(i=0;i<30;i++){ arr.push(i);}
function b(startIdx, endIdx){
return new Promise((resolve, reject)=> {
setTimeout(()=>{
let arrexc = arr.slice(startIdx, endIdx);
for(j = 0; j< arrexc.length; j++){
console.log("exec", arrexc[j]);
}
console.log("called a service:" + new Date().getTime());
resolve("ok");
}, 1000);
});
//return "called a service no promise";
}
async function a(){
let startIdx = 0;
let endIdx = startIdx + batchSize;
while(arr.length > endIdx) {
let res = await b(startIdx, endIdx);
//let res = b();
console.log(res);
startIdx = endIdx;
endIdx = endIdx + batchSize;
}
}
</script>
<button onclick="a()">click</button>
</html>
运行结果
相关知识：
Rxjs forkJoin方法：
forkJoin([
this.aService.getData(),
this.bService.getData()
]).subscribe(resArr => {
// 此时的返回结果将被按顺序放在一个数组中
aData = resArr[0];
bData = resArr[1];
}
Promise.all()方法
const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) => {
setTimeout(resolve, 100, 'foo');
});
Promise.all([promise1, promise2, promise3]).then((values) => {
console.log(values);
});
// Expected output: Array [3, 42, "foo"]
JS模拟循环批量请求后台接口的更多相关文章
- Node.js模拟发起http请求从异步转同步的5种方法
使用Node.js模拟发起http请求很常用的,但是由于Node模块(原生和第三方库)提供里面的方法都是异步,对于很多场景下应用很麻烦,不如同步来的方便.下面总结了几个常见的库API从异步转同步的几种 ...
- mock.js模拟ajax数据请求
在我们开发过程中存在着前端页面ui完成了,但是没有接口进行联调数据的情况,现在介绍一下用mock.js来完成数据的请求.这样在后期我们的后台接口完成后只需要更改请求的接口名字即可!前提是你的模拟字段名 ...
- 利用在线HTTP接口测试工具ApiPost，模拟移动端请求API接口
我们做开发一般都是在PC端,然而我们很多时候需要模拟移动端进行接口请求. 比如,当一个API需要根据用户不同的终端来返回不同的数据时,就需要一个工具来模拟不同的终端了. 利用接口测试工具ApiPost ...
- jQuery请求后台接口
function test() { console.log("请求准备发送"); $.ajax({ type : "POST", url : "/ap ...
- 【11】ajax请求后台接口数据与返回值处理js写法
$.ajax({ url: "/test.php",//后台提供的接口 type: "post", //请求方式是post data:{"type ...
- dva框架使用mock.js模拟数据 + fetch请求数据
what DVA? Dva是基于Redux做了一层封装,对于React的state管理,有很多方案,我选择了轻量.简单的Dva. dva 可以很方便就使用mock.js进行数据的模拟. 只需要三步,即 ...
- vue-resource post请求后台接口报400（跨域问题解决方法）
1.打开config/index.js,在proxyTable中添写如下代码 proxyTable: { '/api': { //使用"/api"来代替"http://f ...
- vue_axios请求后台接口cookie无法传值
2018年3月7日: 当我们使用http向后台发送请求的时候,需要通过cookie把一些密匙传递给后台做判断授权登陆,当然前提是后台会先把cookie保持到本地. 使用vue开发的时候,会出现这个问题 ...
- ES6+Vue+webpack项目，在ie11中请求后台接口后数据更新，但是页面没有刷新？
因为ie11下,如果GET请求请求相同的URL,默认会使用之前请求来的缓存数据,而不会去请求接口获取最新数据,我用的解决方法是在每个请求发送前,拦截请求并给请求接口的URL后加一个时间戳(new Da ...
- java前端跨域请求后台接口
response.setHeader("Access-Control-Allow-Origin", "*"); /* 星号表示所有的域都可以接受, */ res ...
随机推荐
- [FAQ] Edge/Chrome 网络请求的编辑并重发
1. 在网络请求上面右键,复制为fetch. 2. 切换到Console控制台,粘贴并回车. fetch 是javascript中一个网络请求的函数或者工具,Chrome在我们 Copy as fet ...
- [PHP] Laravel-admin 模型表格-列的显示-链接: 关联关系的跳转链接
link 将字段显示为一个链接. // link方法不传参数时,链接的`href`和`text`都是当前列的值 $grid->column('homepage')->link(); // ...
- WPF 触摸底层 PenImc 是如何工作的
在 WPF 里面有其他软件完全比不上的超快速的触摸,这个触摸是通过 PenImc 获取的.现在 WPF 开源了,本文就带大家来阅读触摸底层的代码,阅读本文需要一点 C# 和 C++ 基础 现在 WPF ...
- Anaconda环境下GPT2-Chinese的基本使用记录
偶然在看到了这个项目,感觉很厉害,于是就折腾了下,跑了一跑 项目地址:https://github.com/Morizeyao/GPT2-Chinese 如果Github下载太慢的可以用这个代下载:h ...
- 【Python自动化】定时自动采集，并发送微信告警通知，全流程案例讲解！
目录 一.概要 二.效果演示 三.代码讲解 3.1 爬虫采集行政处罚数据 3.2 存MySQL数据库 3.3 发送告警邮件&微信通知 3.4 定时机制 四.总结 一.概要 您好!我是@马哥py ...
- 04.2 go-admin前后端打包为一个服务上线
目录 一.思路: 二.打包go-admin-ui为静态文件 a.修改配置文件 b.打包 c.复制dist到go-admin的static目录里 三.配置go-admin a.配置路由 b.访问页面 视 ...
- ElasticSearch使用经验总结
ElasticSearch总结 1.ElasticSearch的查询原理 Elasticsearch底层使用的Lucene的倒排索引技术来实现比关系型数据库更快的过滤的.所以要想了解Es的擦查询原理, ...
- STM CubeMx不能生成代码的解决方法
在使用STM CubeMx时,遇到不能生成代码的问题,即点击"GENERATE CODE"后,软件没有任何反应. 从网上找到若干解决方案,大概是: 以下是可能的解决方法: 1. 确 ...
- d3d12龙书阅读----绘制几何体（上） 课后习题
d3d12龙书阅读----绘制几何体(上) 课后习题 练习1 完成相应的顶点结构体的输入-布局对象 typedef struct D3D12_INPUT_ELEMENT_DESC { 一个特定字符串 ...
- HTML——基本标签
1.标题标签 <h1>标题1</h1> <h2>标题2</h2> <h3>标题3</h3> <h4>标题4</ ...