Use unicloud SMS verification code in uni-app (open, template report, use)

Now Dcloud is constantly improving its functions and applications in all aspects, and grafting in some new technologies. For a programmer engaged in front-end development, some things done by Dcloud are really friendly to our front-end. First, the framework is open source, various plug-ins can be introduced during development, and the UI view components are also very rich.

Really a conscientious developer, great! ! ! !

Recently, hbuilderx version 2.8.11 was officially launched, optimized and added some functions, and the contents have been introduced one by one. Those who are interested can take a look.

Let me briefly introduce how to use the SMS verification code.

Step 1: Activate SMS service

Please go to the Dcloud Developer Center for specific details to see the official guide: https://ask.dcloud.net.cn/article/37534
Get the two values of smsKey and smsSecret when successful (will be used below)
Insert picture description here

Step 2: SMS template report

Use the developer account email send titled SMS service template filing of the message, edit the content as follows:

DCloud: My application appid is xxx, and the application name is xxx.
I have activated uniCloud SMS service, and now I am applying for a SMS template for this application. This template is a verification SMS template, and its content is as follows:
[Fill in SMS signature here] Verification code: ${code}, for$ {action}, the effective $ {expMinute} minutes, and do not disclose the action soon.

Send to : [email protected]

About 0~3 working days, the developer’s mailbox will receive a reply from DCloud, the style is as follows:
Insert picture description here

Step 3: Use
(1) Create a cloud service (I take
Insert picture description here
Alibaba Cloud as an example here) (2) Under the cloud service, right-click and select the new cloud function sandcode file: The
content is as follows:

'use strict';
exports.main = async (event, context) => {
    
    
  try {
    
    
    const res = await uniCloud.sendSms({
    
    
      //smsKey、smsSecret值为开通
      smsKey: 'xxxxxxxxxxxxxxxxxx', 
      smsSecret: 'xxxxxxxxxxxxxxxxxxxxxx',
      phone: '183xxxxxxxx', // 为验证码的接收者号码
      templateId: 'xxxxxxx', // 短信模板id
	  name: 'telcode', // 请注意使用自行申请的模板时必须传name字段，值为报备时填写的应用名称
      data: {
    
    
        code: '123456', // 测试的验证码，可自定义
        action: '注册', // 表明用途
        expMinute: '3', // 有效时间 单位分钟
      }
    })
    // 调用成功，请注意这时不代表发送成功
    return res
  } catch(err) {
    
    
    // 调用失败
    console.log(err.errCode)
    console.log(err.errMsg)
    return {
    
    
      code: err.errCode,
      msg: err.errMsg
    }
  }
};

(3) Trigger calling cloud functions on the login page of the uniapp project

<button type=“default” @tap=“send()”>发送

send() {
    
    
 uniCloud.callFunction({
    
    
 	name: 'sendcode',
	success: (e)=> {
    
    
		console.log('这是发送验证码', e.result);
	}
 })
 }

Step 4: Test
At this point the receiver (my) mobile phone receives a text message:
Insert picture description here

At this point, the SMS verification code sharing is over, everyone is welcome to leave a message!

Use unicloud SMS verification code in uni-app (open, template report, use)

Guess you like