更新记录

1.9.0（2024-03-29） 下载此版本

更新配置

1.8.0（2024-03-28） 下载此版本

更新配置

1.7.0（2024-03-28） 下载此版本

更新配置

平台兼容性

云函数类插件通用教程

使用云函数类插件的前提是：使用HBuilderX 2.9+

<template>
    <view class="login">
        <view class="title">
            微光后台
        </view>
        <view class="input-item">
            <uni-section title="邮箱" type="line"></uni-section>
            <view class="email-input">
                <input class="popup-content-input" v-model="email" placeholder="请输入手机号" />
                <view class="send" @click="handleSend">{{ time ? time + 's' : '发送验证码'}}</view>
            </view>
        </view>
        <view class="input-item">
            <uni-section title="验证码" type="line"></uni-section>
            <input class="popup-content-input" :maxlength="capacity" v-model="code" placeholder="请输入邮箱验证码" />
        </view>
        <view class="common-button" @click="handleValidate">
            登录
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                _id: "", //发送成功验证码标识
                email: '15327@qq.com', //需发送验证码的目标邮箱
                code: "", //验证码
                capacity: 6, //验证码位数（1-8位），默认：6位
                time: 0
            };
        },
        methods: {
            /**
             * 发送验证码
             */
            async handleSend() {
                const reg = /^\w[-\w.+]*@([A-Za-z0-9]+[-A-Za-z0-9]*\.){1,}[A-Za-z0-9]{2,}$/;
                if (!reg.test(this.email)) {
                    uni.showToast({
                        title: '请输入正确的邮箱',
                        icon: 'none'
                    })
                    return
                }
                if (this.time == 0) {
                    this.time = 4
                    const t = setInterval(() => {
                        this.time = this.time - 1
                        if(this.time == 0) clearInterval(t)
                    }, 1000)
                    const emailValidateCode = uniCloud.importObject('email-validate-code')
                    const result = await emailValidateCode.sendEmailCode({
                        capacity: this.capacity, //验证码位数（1-8位），默认：6位
                        validMinute: 5, //邮箱验证码有效期
                        serviceType: 'qq', // 邮箱类别
                        email: this.email, // 发送验证码的目标邮箱
                        subject: '注册验证码', // 邮箱标题
                        text: '感谢您注册,注册码是#code#', // 邮箱内容
                    })
                    console.log(result)
                    if (result.success) {
                        this._id = result.id;
                        this.code = result.code;
                    }
                    uni.showToast({
                        icon: 'none',
                        title: result.message
                    })
                } else return
            },
            /**
             * 登录
             */
            async handleValidate() {
                if (!this.email || !this.code) {
                    uni.showToast({
                        title: this.email ? '请输入邮箱验证码' : '请输入的邮箱',
                        icon: 'none'
                    })
                    return
                }
                const emailValidateCode = uniCloud.importObject('email-validate-code')
                const result = await emailValidateCode.validateEmailCode({
                    _id: this._id, // 邮箱发送成功的唯一id
                    email: this.email, // 验证发送邮箱
                    code: this.code
                })
                console.log(result)
                if (result.success) {
                    console.log('--验证成功--')
                } else uni.showToast({
                    icon: 'none',
                    title: result.message
                })
            },
        }
    }
</script>
<style lang="scss">
    page {
        background: #fff;
    }

    .login {
        .title {
            font-size: 44rpx;
            font-weight: 500;
            text-align: center;
            margin: 240rpx auto 0;
        }

        .input-item {
            width: 700rpx;
            margin: 10rpx auto;
            padding: 0 0 20rpx 0;
            border-bottom: 1px solid rgba(52, 52, 52, 0.2);

            .popup-content-input {
                flex: 1;
            }

            .email-input {
                display: flex;

                .send {
                    width: 160rpx;
                    text-align: center;
                    padding: 8rpx;
                    border-radius: 4rpx;
                    background: linear-gradient(to right, #FEEF3C, #F3CD34);
                }
            }
        }

        .common-button {
            width: 680rpx;
            height: 80rpx;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 28rpx;
            border-radius: 10rpx;
            margin: 50rpx auto;
            background: linear-gradient(to right, #FEEF3C, #F3CD34);
        }
    }
</style>

获取邮箱qq授权码

见右侧图 qq邮箱左上角-设置 -> 设置-账户 -> 账户-POP3/IMAP/SMTP/Exchange/CardDAV/CalDAV服务

在email-validate-code云函数写入配置

源码版使用有问题+vx: aqiangssx

sendEmailCode 方法

validateEmailCode 方法