vue3 前端 去循环一个接口获取结果

有的时候 在我们开发过程中我i们会出现一个问题 就是一个后端的接口 哦我们需要调用多次才会出现结果 我们就需要连续掉用 

有时候为了避免后端的压力的太大

我总结了一下前端的写法

1.有次数限制的

const getPayData = async (orderId) => {
    const orderResult = await indexApi.submitOrderResult({ orderId });
    if (orderResult.state == 200 && orderResult.code == 200) {
        return orderResult; // 返回订单结果
    }
};

const pollOrderResult = async (orderId, maxTries, delay) => {
    if (maxTries <= 0) {
        // 达到最大尝试次数,停止轮询
        console.error("达到最大尝试次数,未获取到订单结果");
        return null; // 返回 null 或抛出错误表示失败
    }

    try {
        // 调用接口获取订单结果
        const orderResult = await indexApi.submitOrderResult({ orderId });

        // 检查订单结果是否满足条件
        if (orderResult.state == 200) {
            switch (orderResult.code) {
                case 200:
                    // 订单已处理完成,停止轮询
                    console.log("订单处理完成", orderResult);
                    Taro.hideLoading();
                    return orderResult.data; // 返回订单结果
                case 202:
                    // 订单仍在处理中(可能是一个特殊的成功状态码)
                    console.log("订单仍在处理中(202),稍后重试...");
                    // 注意:这里你可能不需要返回,因为不是错误,但也不是完成
                    // 如果想继续轮询,则不要返回,让函数继续执行
                    Taro.hideLoading();

                    break;
                case 503:
                    // 服务器内部错误
                    console.error("服务器内部错误,稍后重试...");
                    // 你可以选择在这里继续轮询,或者返回错误
                    // 如果选择继续轮询,则不要返回
                    break;
                default:
                    // 其他未知的错误码
                    console.error("未知的订单结果错误码", orderResult.code);
                    // 你可以在这里决定是继续轮询还是返回错误
                    break;
            }
        } else {
            // HTTP状态码不是200,通常表示有错误发生
            console.error("HTTP状态码错误", orderResult.state);
            // 在这里你可以选择继续轮询,返回null,或者抛出错误
        }

        // 如果未达到终止条件,则等待一段时间后再次尝试
        console.log("订单仍在处理中,稍后重试...");
        await new Promise((resolve) => setTimeout(resolve, delay));

        // 递归调用自己进行下一轮轮询
        return await pollOrderResult(orderId, maxTries - 1, delay);
    } catch (error) {
        // 处理获取订单结果时出现的错误
        // 可以选择重试、记录错误或停止轮询等
        console.error("获取订单结果时出错", error);

        // 如果错误允许重试,并且还有剩余尝试次数,则递归调用自己
        if (maxTries > 1) {
            return await pollOrderResult(orderId, maxTries - 1, delay);
        } else {
            // 如果没有剩余尝试次数,则返回null或抛出错误
            return null; // 或者抛出错误
        }
    }
};

调用

只要有结果就会停止 这样写次数 是为了防止 前端死循环

2.没有次数 的写法 

let shouldStopPolling = false; // 外部变量或标志来控制轮询是否应该停止  
  
const pollOrderResult = async (orderId, delay) => {  
    if (shouldStopPolling) {  
        return; // 如果应该停止轮询,则直接返回  
    }  
  
    try {  
        const orderResult = await indexApi.submitOrderResult({ orderId });  
  
        if (orderResult.state == 200) {  
            switch (orderResult.code) {  
                case 200:  
                    console.log("订单处理完成", orderResult);  
                    Taro.hideLoading();  
                    shouldStopPolling = true; // 设置标志以停止轮询  
                    return orderResult.data;  
                case 202:  
                    console.log("订单仍在处理中(202),稍后重试...");  
                    Taro.hideLoading(); // 可能不需要在这里隐藏加载,因为订单还在处理中  
                    break;  
                case 503:  
                    console.error("服务器内部错误,稍后重试...");  
                    // 对于某些错误,您可能想设置应该停止轮询,或者只是等待并重试  
                    break;  
                default:  
                    console.error("未知的订单结果错误码", orderResult.code);  
                    // 对于某些错误,您可能想设置应该停止轮询  
                    break;  
            }  
        } else {  
            console.error("HTTP状态码错误", orderResult.state);  
        }  
  
        // 如果订单没有处理完成,等待并重试  
        if (!shouldStopPolling) {  
            console.log("订单仍在处理中,稍后重试...");  
            await new Promise((resolve) => setTimeout(resolve, delay));  
            await pollOrderResult(orderId, delay); // 递归调用自己  
        }  
    } catch (error) {  
        console.error("获取订单结果时出错", error);  
        // 对于某些错误,您可能想设置应该停止轮询  
        // 这里我们假设除非明确设置,否则继续轮询  
        if (!shouldStopPolling) {  
            await new Promise((resolve) => setTimeout(resolve, delay));  
            await pollOrderResult(orderId, delay); // 递归调用自己  
        }  
    }  
};  
  
// 调用轮询函数  
pollOrderResult(someOrderId, someDelay);  
  
// 当需要停止轮询时,设置 shouldStopPolling 为 true  
// 例如,在某个用户操作或外部事件后  
// shouldStopPolling = true;

各有各的好处吧 这个是 一直等到有结果的时候 终止循环 但是 会容易导致死循环 如果没有处理好的话

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/755502.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

MacBook 中 Java使用testcontainers报错

环境 MacBook 问题 Java代码中使用testcontainers启动报错 ERROR org.testcontainers.dockerclient.DockerClientProviderStrategy - Could not find a valid Docker environment. Please check configuration. Attempted configurations were:UnixSocketClientProviderStr…

鸿蒙NEXT

[中国&#xff0c;东莞&#xff0c;2024年6月24日] 华为开发者大会&#xff08;HDC&#xff09;正式开幕&#xff0c;带来全新的 HarmonyOS NEXT、盘古大模型5.0等最创新成果&#xff0c;持续为消费者和开发者带来创新体验。 HarmonyOS NEXT 鸿蒙生态 星河璀璨 鸿蒙生态设备数…

亨廷顿(Huntington)方法-名额分配

前言 20世纪初&#xff0c;美国人口普查局局长约瑟夫A亨廷顿&#xff08;Joseph A. Hill&#xff09;和数学家爱德华V亨廷顿&#xff08;Edward V. Huntington&#xff09;在研究议会议席分配问题时&#xff0c;提出了一种基于数学原理的算法。该算法通过计算每个州的人口比例&…

【数组】- 螺旋矩阵 II

1. 对应力扣题目连接 螺旋矩阵 II 题目简述&#xff1a; 给你一个正整数 n &#xff0c;生成一个包含 1 到 n2 所有元素&#xff0c;且元素按顺时针顺序螺旋排列的 n x n 正方形矩阵 matrix 。如图&#xff1a; 2. 实现案例代码 public class SpiralMatrix {public static…

重磅更新-UniApp自定义字体可视化设计

重磅更新-UniApp自定义字体可视化设计。 DIY可视化为了适配不同APP需要&#xff0c;支持用户自定义字体&#xff0c;自定义字体后&#xff0c;设计出来的界面更多样化&#xff0c;不再是单一字体效果。用户可以使用第三方字体加入设计&#xff0c;在设计的时候选择上自己的字体…

MyBatis第一节

目录 1. 简介2. 配置3. doing3.1 创建一个表3.2 打开IDEA&#xff0c;创建一个maven项目3.3 导入依赖的jar包3.4 创建entity3.5 编写mapper映射文件(编写SQL)3.6 编写主配置文件3.7 编写接口3.8 测试 参考链接 1. 简介 它是一款半自动的ORM持久层框架&#xff0c;具有较高的SQ…

【技术指南】稳压器(电压调节器):原理、类型及其实际用用案例

电压调节器&#xff08;稳压器&#xff09;是一种电子器件或电路&#xff0c;用于控制电路中的电压水平&#xff0c;以确保在电源电压波动或负载变化时&#xff0c;输出电压能够保持在设定的稳定水平。它们通常用于各种电子设备和电源系统中&#xff0c;以提供稳定的电压供应。…

AI绘画 Stable Diffusion【特效文字】:火焰特效艺术字,轻松搞定特效生成!

大家好&#xff0c;我是画画的小强 今天我们继续艺术字系列的分享&#xff0c;艺术字的玩法很多&#xff0c;今天给大家带来的是火焰特效艺术字的制作。我们先来看火焰特效艺术字的效果图。 一. 火焰特效文字的制作方法 【第一步】&#xff1a;制作底图 这里制作底图使用白底…

HarmonyOS Next开发学习手册——通过startAbilityByType拉起垂类应用

使用场景 开发者可通过特定的业务类型如导航、金融等&#xff0c;调用startAbilityByType接口拉起对应的垂域面板&#xff0c;该面板将展示目标方接入的垂域应用&#xff0c;由用户选择打开指定应用以实现相应的垂类意图。垂域面板为调用方提供统一的安全、可信的目标方应用&a…

数据结构与算法笔记:高级篇 - 搜索:如何用 A* 搜索算法实现游戏中的寻路功能?

概述 魔兽世界、仙剑奇侠传这类 MMRPG 游戏&#xff0c;不知道你玩过没有&#xff1f;在这些游戏中&#xff0c;有一个非常重要的功能&#xff0c;那就是任务角色自动寻路。当任务处于游戏地图中的某个位置时&#xff0c;我们用鼠标点击另外一个相对较远的位置&#xff0c;任务…

Flutter循序渐进==>Dart之类型、控制流和循环

导言 磨刀不误砍柴工&#xff0c;想搞好Flutter&#xff0c;先学好Flutter&#xff0c;还是本着我学Python的方法&#xff0c;先从数据类型、控制流和循环开始&#xff0c;这是每一种编程语言必用的。编程语言是相通的&#xff0c;基本精通一种后&#xff0c;学其它的就变得很…

网络配置(IP、NETMASK、GATEWAY、DNS、DHCP) <持续更新中>

参考&#xff1a; 初学Linux之网络配置(IP、NETMASK、GATEWAY、DNS、DHCP)-CSDN博客【学习笔记】网关 & 路由_网关和路由-CSDN博客【学习笔记】计算机网络 IP地址与MAC地址_根据mac分配ip-CSDN博客【学习笔记】TCP 和 UDP 协议_tcp 发送 syn 应答没有syn ack-CSDN博客 一…

Kafka 位移

Consumer位移管理机制 将Consumer的位移数据作为一条条普通的Kafka消息&#xff0c;提交到__consumer_offsets中。可以这么说&#xff0c;__consumer_offsets的主要作用是保存Kafka消费者的位移信息。使用Kafka主题来保存位移。 消息格式 位移主题就是普通的Kafka主题。也是…

计算机组成原理:海明校验

在上图中&#xff0c;对绿色的7比特数据进行海明校验&#xff0c;需要添加紫色的4比特校验位&#xff0c;总共是蓝色的11比特。紫色的校验位pi分布于蓝色的hi的1, 2, 4, 8, 16, 32, 64位&#xff0c;是2i-1位。绿色的数据位bi分布于剩下的位。 在下图中&#xff0c;b1位于h3&a…

高频面试题基本总结回顾2(含笔试高频算法整理)

干货分享&#xff0c;感谢您的阅读&#xff01; &#xff08;暂存篇---后续会删除&#xff0c;完整版和持续更新见高频面试题基本总结回顾&#xff08;含笔试高频算法整理&#xff09;&#xff09; 备注&#xff1a;引用请标注出处&#xff0c;同时存在的问题请在相关博客留言…

kubernetes给指定用户分配调用k8s的api权限

文章目录 概要利用RBAC添加角色权限使用shell命令创建角色权限使用配置文件创建角色权限 调用k8s的api获取k8s账户的token 小结 概要 使用kubernetes部署项目时&#xff0c;有些特殊场景&#xff0c;我们需要在自己创建的pod里面调用k8s的api来管理k8s&#xff0c;但是需要使用…

论文笔记:Spatial-Temporal Interval Aware Sequential POI Recommendation

ICDE 2022 1 intro 1.1 背景 空间&#xff08;Spatial&#xff09;和时间&#xff08;Temporal&#xff09;信息是序列 POI 推荐中两个重要且相辅相成的因素。 空间因素&#xff08;如地理距离间隔&#xff09;可以在用户的历史轨迹呈现空间分簇现象时&#xff0c;细粒度刻画…

Elasticsearch 聚合查询简介

Hi~&#xff01;这里是奋斗的小羊&#xff0c;很荣幸您能阅读我的文章&#xff0c;诚请评论指点&#xff0c;欢迎欢迎 ~~ &#x1f4a5;&#x1f4a5;个人主页&#xff1a;奋斗的小羊 &#x1f4a5;&#x1f4a5;所属专栏&#xff1a;C语言 &#x1f680;本系列文章为个人学习…

Pytest集成Allure生成测试报告

# 运行并输出报告在Report文件夹下 查看生成的allure报告 1. 生成allure报告&#xff1a;pycharm terminal中输入命令&#xff1a;产生报告文件夹 pytest -s --alluredir../report 2. pycharm terminal中输入命令&#xff1a;查看生成的allure报告 allure serve ../report …

[数据集][目标检测]婴儿状态睡觉哭泣检测数据集VOC+YOLO格式7109张3类别

数据集格式&#xff1a;Pascal VOC格式YOLO格式(不包含分割路径的txt文件&#xff0c;仅仅包含jpg图片以及对应的VOC格式xml文件和yolo格式txt文件) 图片数量(jpg文件个数)&#xff1a;7109 标注数量(xml文件个数)&#xff1a;7109 标注数量(txt文件个数)&#xff1a;7109 标注…