uniapp使用云开发实现手机短信打开小程序
发布于 2 年前 作者 xiangyong 586 次浏览 来自 分享

第一步:创建新的小程序开发时选择微信云开发

第二步:项目打开后进入云开发控制台,开通静态资源和云函数两个功能(收费功能:按量计费)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加上即可

回到顶部