接口处理请求时间过长，前台响应“服务器超时”的解决办法

最新推荐文章于 2024-12-12 11:37:45 发布

weixin_30917213

最新推荐文章于 2024-12-12 11:37:45 发布

阅读量7.9k

点赞数 1

CC 4.0 BY-SA版权

文章标签： java 前端后端 ViewUI

原文链接：http://www.cnblogs.com/lemoncool/p/10243871.html

为解决数据计算量过大导致的接口响应超时问题，本文介绍了一种通过将单一接口拆分为获取唯一标识、轮询查询状态和最终查询结果的三个异步接口的方法，有效提高了系统的响应速度和用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

数据计算量过大，接口响应时间过长时，网关会报超时，页面就挂了，没有很好的解决办法，所以采用了如下解决办法-
1.将原本的一个接口拆分为3个，三个接口异步操作。三个接口作用及描述如下：

接口1：获取本地异步操作的唯一标识-唯一且加密后的code值

　　　　请求体：此次查询操作的查询条件
　　　　返回体：唯一的加密后的唯一code

接口2：轮询此次查询的结果是否已计算并准备好

　　　　请求体：接口1返回的code
　　　　返回体：-1或0 -----0 数据未计算完成 1-数据已经计算完成并准备好

接口3：查询

　　　　请求体：接口1返回的code
　　　　返回体：最终的查询结果
2.三个接口的执行顺序：

页面发起查询请求，首先调用接口1，获取code。
code已返回，前端启用定时器，固定间隔调用接口2，直到接口2返回1，停止轮询，调用接口3，拿到返回数据，渲染页面。
前端开始调用接口2时，后端同时执行接口2和3 ，获取查询状态

3.大致代码如下：

pollingFunctions () {
    if (this.queryTimer) {
        clearInterval(this.queryTimer);
    }
    let _this = this;
        // 接口1-获取唯一标识code
    functionA(copyParams).then(({ data, error }) => {
        if (data) {
            // 接口2-查询是否完成
            _this.queryTimer = setInterval(function () {
                functionB({ onlyCode: data }).then(({ data, error }) => {
                    if (data) { // 成功
                        if (data === '0') {
                            clearInterval(_this.queryTimer);
                            functionC();        // 接口3-查询
                        }
                    } else { // 失败
                        clearInterval(_this.queryTimer);
                        _this.$message.error(error.message);
                    }
                });
            }, 10000);
        } else {
            _this.$message.error(error.message);
        }
    });
}