第一步:创建新的小程序开发时选择微信云开发
第二步:项目打开后进入云开发控制台,开通静态资源和云函数两个功能(收费功能:按量计费)Note:云开发需要企业性质的小程序
第三步:上传静态资源到云开发服务器上,网站配置里面(官方模板:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/staticstorage/msg-miniprogram.html)
第四步:在项目的开发目录下增加一个云函数的目录文件,也可以手写(上面下载的模板包里面有public云函数模板)
Node:开发工具是识别的uniapp打出来的包dist/mp-weixin,打包目录里没有copy云函数文件,我们需要引入(npm install copy-webpack-plugin [@5](/user/5).1.1)此依赖来把云函数目录copy到小程序能识别的dist/mp-weixin包内。创建一个vue.config.js,贴上以下代码:
const path = require('path')
const CopyWebpackPlugin = require('copy-webpack-plugin')
module.exports = {
configureWebpack: {
plugins: [
new CopyWebpackPlugin([
{
from: path.join(__dirname, 'src/cloudfunctions'),
to: path.join(__dirname, 'dist', process.env.NODE_ENV === 'development' ? 'dev' : 'build', process.env.UNI_PLATFORM, 'cloudfunctions')
}
])
]
}
}
Note:在app.vue onLaunch贴以下代码:
if (!wx.cloud) {
console.error('请使用 2.2.3 或以上的基础库以使用云能力')
} else {
wx.cloud.init({
env: '', // appid
traceUser: true,
})
}
第五步:重新编译和重启开发工具就会发现文件已经成功的复制了,右键上传并部署:安装依赖,云函数就同步到服务器上了,一个云函数就OK了
第六步:接下来就是手机短信跳转到H5,新建一个sendsms云函数,在index.js贴以下代码:
const cloud = require('wx-server-sdk')
cloud.init({
env: cloud.DYNAMIC_CURRENT_ENV,
})
exports.main = async (event, context) => {
try {
const config = {
env: event.env,
content: event.content ? event.content : '发布了短信跳转小程序的新能力',
path: event.path,
phoneNumberList: event.number
}
const result = await cloud.openapi.cloudbase.sendSms(config)
return result
} catch (err) {
return err
}
}
第七步:在需要调用云函数的地方调用云函数即可触发发送短信:
wx.cloud.callFunction({
name:'sendsms',
data:{
env: "",//网页上传的静态托管的环境ID
path: "/index.html",//上传的网页相对根目录的地址,如果是根目录则为/index.html
number:[
"+86", //你要发送短信的目标手机,前面需要添加「+86」
]
},success(res){
console.log(res)
}, error(err) {
console.log(err)
}
})
Note:项目的project.config.json加上即可