需求:
用户在任何环境下(pc除外),点击直播都能跳转到小程序对应直播间
分析:
环境包括:微信浏览器,小程序,其他浏览器,移动掌厅
微信浏览器:可使用微信开放标签或云函数
小程序:可直接调用 wx.miniProgram.navigateTo
其他浏览器:云函数
移动掌厅:掌厅内部方法(省略)
以上分析来看,主要还是通过云函数来实现较为方便,开搞
开发
一、创建云函数
开通云函数可自行研究,一般新建项目中都会有cloudfunctions文件夹,如果当前项目没有此文件夹可以新建文件夹,然后右键新建云函数,如果右键没有此菜单选项,可以直接新建个小程序,复制里面的文件夹即可
这是创建后的目录结构
h5跳小程序,主要是通过小程序scheme码进行跳转的,由于需求是需要动态的scheme码,只能使用云函数来获取了,我们更改下入口函数
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
// 云函数入口函数
exports.main = async (event) => {
return cloud.openapi.urlscheme.generate({
jumpWxa: {
path: event.path,
query: event.query,
},
isExpire: true,
expire_time: Math.round(new Date().getTime() / 1000) + 3600
})
}
cloud.openapi.urlscheme.generate()的具体调用可以参考官方文档,event为调用时传入的参数
二、上传云函数
先在云函数权限中修改一下安全规则,允许所有用户访问
"*": {
"invoke": "auth != null"
},
"public": {
"invoke": true
}
}
直接上传
三、用户端跳转公共方法
function getCurrentEnv() {
let ua = navigator.userAgent.toLowerCase();
return new Promise((resolve, reject) => {
if (ua.match(/MicroMessenger/i) == "micromessenger") {
wx.miniProgram.getEnv((res) => {
if (res.miniprogram) {
//微信小程序
resolve('1')
} else {
//微信浏览器
resolve('2')
}
})
} else {
//其他外部浏览器
resolve('4')
}
})
};
function goWxminiprog(path) {
getCurrentEnv().then(env => { //获取当前环境函数,
if (env === '1') { //小程序
wx.miniProgram.navigateTo({ url: path });
}
else{
wx.config({
// debug: true, // 调试时可开启
appId: '**********', // <!-- 替换掉即可 -->
timestamp: 0, // 必填,填任意数字即可
nonceStr: 'nonceStr', // 必填,填任意非空字符串即可
signature: 'signature', // 必填,填任意非空字符串即可
jsApiList: ['chooseImage'], // 必填,随意一个接口即可
openTagList:['wx-open-launch-weapp'], // 填入打开小程序的开放标签名
})
var c = new cloud.Cloud({
// 必填,表示是未登录模式
identityless: true,
// 资源方 AppID
resourceAppid: '**********', <!-- 替换掉即可 -->
// 资源方环境 ID
resourceEnv: '**********',<!-- 替换掉即可 -->
})
let data = path.split("?")
path = data[0][0]==="/"?data[0].substr(1):data[0] //去掉"/"
let query = data[1]||''
console.log('path:'+path)
console.log('query:'+query)
c.init().then(()=>{
c.callFunction({
name: 'openMini',
data: {
path:path,
query:query //参数的格式为"a=1&b=2"
},
}).then(res=>{
console.warn(res)
location.href = res.result.openlink
})
})
}
}).catch(()=>{
console.log('当前环境不支持跳转小程序')
});
};
export default goWxminiprog
入参为完整跳转路径,包含参数,callFunction中name为云函数名称,data为云函数的参数,即云函数入口函数中的event参数,
一切就绪,来调用一下
可以看到,跳转的路径以及参数都已拿到
成功!!!