使用dcloud全家桶开发公众号H5系统

公众号域名配置及参数配置

小韦云科技-区块链+小程序+公众号+商城+分销+直播+企业官网+外贸电商-为您提供优质的开发服务-电话/微信联系:18123611282

公众号平台配置

登录公众号平台(https://mp.weixin.qq.com/

公众号设置--功能设置页面,先设置好业务,JS,网页三个地方的安全域名。

在测试号设置安全域名(正式公众号设置的地方在: 公众号设置--功能设置 里):

设置网页授权域名

确认保存

公众号参数配置到uni-config-center

由于公众号的参数(如appid,appsecret等)都是比较机密的信息,直接写到前端uniapp里不大安全,可以像上一节增加uni-id配置一样增加公众号配置到uni-config-center

uni_modules\uni-config-center\uniCloud\cloudfunctions\common\uni-config-center目录下创建bctos-weixin-h5目录,然后在其下面创建config.json文档,要根据自己公众号的实际的参数填写

{
    "appId": "公众号appid",
    "appSecret": "公众号密钥",
    "mchId": "微信支付商户ID",
    "mchKey": "微信支付API密钥",
    "notify_url": "微信支付回调地址"
}

增加读取配置的云函数

由于前端uniapp无法直接读取uni-config-center里的配置,需要一个云函数帮我们实现参数的读取。

在uniCloud/cloudfunctions目录上右键新键云函数,函数名为:bctos-config-center,在自动生成的index.js文件写入以下代码

'use strict';
const createConfig = require('uni-config-center')

exports.main = async (event, context) => {
    //event为客户端上传的参数
    console.log('event : ', event)

    if (typeof(event.pluginId) == "undefined") event.pluginId = 'bctos-weixin-h5';

    const uniIdConfig = createConfig({
        pluginId: event.pluginId
    })

    if (typeof(event.key) == "undefined" || event.key == '') {
        console.log('获取全部配置');
        return uniIdConfig.config();
    } else {
        console.log('获取指定配置');
        return uniIdConfig.config(event.key);
    }
};

由于这个云函数使用了uni-config-center,因此需要右键bctos-config-center目录管理公共模块依赖

之前由于对云函数理解不深,以为直接引用就可以,其实每个云函数在运行都是在相互独立的环境中,因此资源是不互相共用的,云函数每次引用别的资源时,都需要重新执行管理公共模块依赖以便更新依赖。

测试前端是否能获取到配置

打开pages/index/index文件,直接onLoad方法里加入测试代码看看能不能取到配置数据

        onLoad() {
            uniCloud.callFunction({
                name: "bctos-config-center",
                data: {}
            }).then(res => {
                console.log('config', res);
            })
        },

在HBuilder X的调试里选择连接本地云函数,因为云函数和配置还没上传云端,所以要选择本地调试

然后运行项目到内置浏览器看看

运行起来后我们可以看到配置信息

说明我们已经能正常读取公众号配置信息

本文由小韦云原创,转载请注明出处:https://bctos.cn/doc/18/1959,否则追究其法律责任

关键词:公众号

广告位招商