一、开通阿里云短信服务
1. 开通入口
阿里云官网的产品导航搜索短信服务,然后点击免费开通
2. 开通服务
扫码进群,点击开通服务
3. 领取体验包
手机钉钉领取试用包
4. 快速开始
开始学习和测试完成前两个步骤
二、完成快速测试
1. 申请签名
2. 申请模版
要在签名通过以后申请模版,不然不能关联签名
申请完成后需要保存两个数据,签名名称(SignName)和短信模板CODE(TemplateCode)
3. 绑定测试手机
因为我们这里填写的是测试签名,所以需要绑定测试手机,通过该手机来接收短信,需要上线时选择已备案网站就可以使用国内手机号了
三、子账户授权
创建子账户,并且保存子账号的秘钥等信息
给该用户添加管理短信服务(SMS)的权限
现在我们拿到了4个需要的数据,添加到.env环境变量,example:
# sms
ALIBABA_CLOUD_ACCESS_KEY_ID="LTA..."
ALIBABA_CLOUD_ACCESS_KEY_SECRET="O9Xd..."
ALIBABA_CLOUD_SMS_SIGN_NAME="itsh...s"
ALIBABA_CLOUD_SMS_TEMPLATE_CODE="SMS_46..."
四、开始验证
NodeSDK:help.aliyun.com/zh/sms/node…
执行以下命令,安装阿里云SDK核心库。
npm install @alicloud/pop-core -S
官网给出的代码不符合我们的预期,将其改造一下,导出一个方法,需要传入手机号和随机生成的code
// src/lib/sendSms.ts
import Core from '@alicloud/pop-core'
var client = new Core({
accessKeyId: process.env.ALIBABA_CLOUD_ACCESS_KEY_ID!,
accessKeySecret: process.env.ALIBABA_CLOUD_ACCESS_KEY_SECRET!,
endpoint: 'https://dysmsapi.aliyuncs.com',
apiVersion: '2017-05-25',
})
const baseParams = {
SignName: process.env.ALIBABA_CLOUD_SMS_SIGN_NAME, //短信签名名称
TemplateCode: process.env.ALIBABA_CLOUD_SMS_TEMPLATE_CODE, //短信模板CODE
}
var requestOption = {
method: 'POST',
}
type TSendParams = {
phone: string
numStrCode: string
}
export const SendSms = async (params: TSendParams) => {
const { phone, numStrCode } = params
const info = await client.request(
'SendSms',
{
...baseParams,
PhoneNumbers: phone,
TemplateParam: JSON.stringify({ code: numStrCode }),
},
requestOption
)
return info
}
那么接下来在phoneActive简单的调用一下该方法
// src/trpc/index.ts
// 发送短信
await SendSms({
phone,
numStrCode: smsCode,
})
目前我们就基本完成了关于注册的全部内容,接下来开始处理用户登录。
五、上线使用
在完成初始版本有基本的功能后就可以申请已备案网站的签名和模版
这个时候就不会带有测的标识,任意手机号都可以注册网站