函数返回Promise链式调用,然后继续使用then方法执行,为什么执行顺序不对?

发布于 2022-09-11 23:45:55 字数 5732 浏览 13 评论 0

代码如下:

function getPlayerAddress(cameraId) {
            //请求摄像头的直播链接,服务器返回正确结果后进入第一个then函数
            let promise = new Promise(function (resolve, reject) {
                $.ajax({
                    type: "GET",
                    url: "/cameraManage/getCameraAddress?id=" + cameraId,
                    success: function (data) {
                        if (data.state == 'success') {
                            resolve(data.data);
                        } else {
                            //TODO 错误处理
                            console.log(data.msg);
                        }
                    },
                    error: function (e) {
                        console.log("error");
                    }
                });
            });

            promise
                .then(function (data) {
                    console.log("进入第1个then,接收到数据如下");
                    console.log(data);
                    serial = data.serial;
                    channelNo = data.channelNo;
                    return new Promise(function (resolve, reject) {
                        if (data.camera) {//服务器直接返回了摄像头直播信息
                            resolve(data);
                        } else if (data.accessToken) {//服务器返回了accessToken
                            resolve(data);
                        } else if (data.appKey && data.appSecret) {//服务器返回了appKey && appSecret
                            $.ajax({
                                type: "POST",
                                url: "https://open.ys7.com/api/lapp/token/get",
                                data: {
                                    appKey: data.appKey,
                                    appSecret: data.appSecret
                                },
                                dataType: "json",
                                success: function (data) {
                                    let tokenData = data.data;
                                    if (data.code == "200" && tokenData) {
                                        resolve(tokenData);
                                        uploadAccessToken(tokenData.accessToken, tokenData.expireTime, 1);
                                    }
                                },
                                error: function (e) {
                                    console.log(e);
                                }
                            });
                        }
                    });
                })
                //通过accessToken获取直播链接
                .then(function (data) {
                    if (data.camera) {
                        console.log("上一步直接返回了camera");
                        return data.camera;
                    }
                    return new Promise((resolve, reject) => {
                        $.ajax({
                            type: "POST",
                            url: "https://open.ys7.com/api/lapp/live/video/list",
                            data: {
                                accessToken: data.accessToken,
                            },
                            dataType: "json",
                            success: function (data) {
                                let addressData = data.data;
                                if (data.code != '200' || !addressData) {
                                    //TODO 错误提示
                                    console.log("直播链接获取失败");
                                    return;
                                }

                                for (let i = 0; i < addressData.length; i++) {
                                    if (addressData[i].deviceSerial == serial && addressData[i].channelNo == channelNo) {
                                        let argObject = {
                                            serial: addressData[i].deviceSerial,
                                            channelNo: addressData[i].channelNo,
                                            flv: addressData[i].flvAddress,
                                            flvHd: addressData[i].hdFlvAddress,
                                            hls: addressData[i].liveAddress,
                                            hlsHd: addressData[i].hdAddress,
                                            rtmp: addressData[i].rtmp,
                                            rtmpHd: addressData[i].rtmpHd
                                        };
                                        console.log("获取了直播链接");
                                        console.log(argObject);
                                        resolve({"camera": argObject});
                                        uploadYs7CameraAddress(argObject);
                                        break;
                                    }
                                }
                            },
                            error: function (e) {
                                console.log(e);
                            }
                        });
                    });

                })
                //直接使用链式调用,返回的data就没有问题
                //.then((data)=>{
                //    console.log('--------------');
                //    console.log(data);
            });
            return promise;
        }
        

我试图使用函数返回promise然后继续使用then来进行链式调用,

getPlayerAddress(30).then((data) => {
            console.log("<><><><><><><");
            console.log(data);
        });

但是上面的函数中的执行语句出现在了第二个then中的打印语句之前,换句话说,上述函数先于第二个then执行了,其中捕获的data是第一个then函数传递的值

这是为什么?????

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

花想c 2022-09-18 23:45:55

那个啥,promise.then其实是创建了新的Promise的,如果想链式调用,你应该 return promise.then().then()返回最后一个then创建的Promise。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文