手机注册使用 axios 请求接口该如何处理

最近想做一个手机注册功能,如下图所示


目前是参考了教程L3,但是目前有一个问题,就是填完手机号,点击获取验证码,会先弹出一个图片验证码,填写图片验证码然后请求短信验证码接口,但是总是返回图片验证码错误的,代码如下

axios.post('{{ route('captchas.store') }}', {
                        phone: $('#phone').val(),
                }).then(function (res) {
                    const captcha_image = res.data.captcha_image_content;
                    const captcha_key = res.data.captcha_key;
                    Swal.fire({
                        imageUrl: captcha_image,
                        input: "text",
                        inputPlaceholder: "请输入图片验证码",
                        showCancelButton: true,
                        confirmButtonText: "确定",
                        cancelButtonText: "取消",
                    }).then(function (result) {
                        if (result.value) {
                            axios.post('{{ route('verificationCodes.store') }}', {
                                captcha_key: captcha_key,
                                captcha_code: result.value,
                            }).then(function () {
                                Swal.fire({
                                    icon: 'success',
                                    title: '短信验证码已发送',
                                    showConfirmButton: false,
                                    timer: 1500,
                                });
                            }, function (err) {
                                if (err.response.status === 401) {
                                    Swal.fire({
                                        icon: 'error',
                                        title: err.response.data.captcha_error,
                                        showConfirmButton: false,
                                        timer: 1500,
                                    });
                                }
                                if (err.response.status === 403) {
                                    Swal.fire({
                                        icon: 'error',
                                        title: err.response.data.captcha_expired,
                                        showConfirmButton: false,
                                        timer: 1500,
                                    });
                                }
                                if (err.response.status === 500) {
                                    Swal.fire({
                                        icon: 'error',
                                        title: err.response.data.system_error,
                                        showConfirmButton: false,
                                        timer: 1500,
                                    });
                                }
                            });
                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: '图片验证码不能为空',
                                showConfirmButton: false,
                                timer: 1500,
                            });
                        }
                    });
                });

route('captchas.store')route('verificationCodes.store')两个路由内容和L3章节内容一致,想问下是不是2个axios异步请求引起的,这种请求依赖该怎么处理……

《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
最佳答案

@schizobulia

file

我打印了一下Cache存入的值,发现里面存的Code在进行hash_equals比较的时候没有进行大小写处理,所以我一直输入的都是小写,导致图片验证码比对一直是错误的......

4年前 评论
schizobulia 4年前
ljheisenberg (作者) (楼主) 4年前
讨论数量: 4

具体的错误是什么

4年前 评论

@schizobulia

file

一直报上面这个错误,图片验证码错误

4年前 评论

@schizobulia

file

我打印了一下Cache存入的值,发现里面存的Code在进行hash_equals比较的时候没有进行大小写处理,所以我一直输入的都是小写,导致图片验证码比对一直是错误的......

4年前 评论
schizobulia 4年前
ljheisenberg (作者) (楼主) 4年前

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!