腾讯云,短信sdk接入,vue2中使用

腾讯云,短信sdk接入,vue2中使用

腾讯云短信sdk网址 进入官网直接搜索 短信sdk

1. 微信扫码登录,如下进入

2.签名自己创建,需要一天审核时间腾讯云,短信sdk接入,vue2中使用_第1张图片

3. 如下,创建模版,也需要时间审核

4. 这里需要注意了,如下先做准备工作

注意,这个短信签名,需要企业,或者自行创建个微信订阅号,才能创建,短信签名需要审核,选择公众号,注意!签名和公众号名称要一致,不然创建无法通过
腾讯云,短信sdk接入,vue2中使用_第2张图片
下面这三个图,是必要的
腾讯云,短信sdk接入,vue2中使用_第3张图片
腾讯云,短信sdk接入,vue2中使用_第4张图片
腾讯云,短信sdk接入,vue2中使用_第5张图片

5. 准备工作就绪,可以开始写代码了

首先前端,只需要请求接口就行

           //请求短信验证码接口
			http.$axios({
				url:'/api/code',
				method:'POST',
				data:{
			 // 传给后台,的手机号
					phone:this.userTel
				}
			}).then(res=>{
				if( res.success ){ // 如果接收的,根据后台返回的验证
				alert('验证码是' + res.data)
					this.code = res.data;
				}
			})

6. 后台真惨,深感同情,这里使用node.js写(比较重要)

接入短信验证码 SDK api链接: node中下载
参考node接sdk文章
下载 cnpm install qcloudsms_js -S

在自己server, node.js创建的express框架中使用,自己创建路由,下面复制粘贴,改 上面4 那里那三个图的,信息就行

var QcloudSms = require("qcloudsms_js");
//发送短信验证码
router.post('/api/code',function(req,res,next){
	// 前端传给后台的手机号
	let tel = req.body.phone;
	
	// 短信应用SDK AppID
	var appid = 1400187558;  // SDK AppID是1400开头
	
	// 短信应用SDK AppKey
	var appkey = "dc9dc3391896235ddc2325685047edc7";
	
	// 需要发送短信的手机号码
	var phoneNumbers = [tel];
	
	// 短信模板ID,需要在短信应用中申请
	var templateId = 285590;  // NOTE: 这里的模板ID`7839`只是一个示例,真实的模板ID需要在短信控制台中申请
	
	// 签名
	var smsSign = "三人行慕课";  // NOTE: 这里的签名只是示例,请使用真实的已申请的签名, 签名参数使用的是`签名内容`,而不是`签名ID`
	
	// 实例化QcloudSms
	var qcloudsms = QcloudSms(appid, appkey);
	
	// 设置请求回调处理, 这里只是演示,用户需要自定义相应处理回调
	function callback(err, ress, resData) {
	    if (err) {
	        console.log("err: ", err);
	    } else {
			res.send({
				code:200,
				data:{
					success:true,
					data:ress.req.body.params[0]
				}
			})
	    }
	}
	
	var ssender = qcloudsms.SmsSingleSender();
	//这个变量:params 就是往手机上,发送的短信
	var params = [  Math.floor( Math.random()*(9999-1000))+1000   ];
	ssender.sendWithParam(86, phoneNumbers[0], templateId,
	  params, smsSign, "", "", callback);  // 签名参数不能为空串
	
})

appid 需要改为自己的 短信应用SDK AppID
appkey 需要改为自己的 短信应用SDK AppKey
腾讯云,短信sdk接入,vue2中使用_第6张图片

templateId // 需要改为下图,自己的 短信模板ID腾讯云,短信sdk接入,vue2中使用_第7张图片

smsSign 请使用真实的已申请的签名, 签名参数使用的是签名内容,而不是签名ID
腾讯云,短信sdk接入,vue2中使用_第8张图片

7. 结束了,自己去发短信吧,免费用户,只要100条,别玩停不下来,也不要用于非法途径,仅供学习使用

你可能感兴趣的:(腾讯云,云计算)