最近在做一個的項目,有一個需求是掃碼查看信息詳情
掃描的情況可能是使用微信掃描,或是其他掃描
如果是微信掃描,則跳轉到對應的小程序,
如果非微信掃碼,則進入H5展示詳細信息
目前需要解決的難題有一下幾個:
微信掃碼如何進入小程序如果不是微信掃碼,如何跳轉到H5展示生成二維碼的數據該放那些內容
圍繞以上問題;有一下接的幾個方案可以解決
方案一:H5+微信小程序
方案二:H5+微信小程序的普通二維碼跳轉小程序
方案三:使用微信小程序生成無限制二維碼
首先去掉第三個方案網頁中打開小程序,因為微信小程序二維碼無法條狀到H5,如果用瀏覽器掃描,則查看不了內容
其次去掉第二個方案,每個小程序生成數量有限,10萬封頂網頁中打開小程序,這對于生成批量的二維碼業務來說,早晚是會出問題的。不過在這里也簡單描述一些,功能的實現:
前期準備
1.一個上線并且認證的小程序
2.一個H5站點
3.二維碼參數生成參數為: ?id=xx
4.掃碼后獲取id 通過id 查詢數據,并通過服務端生成對應的() 一并放回來給前端
5.判斷是否為微信環境 如果是微信環境
是:跳轉..herf=
否:在H5端展示資產詳情
方案二:是最簡單,也是可以解決當前問題的最佳選擇
前期準備:
1.一個上線并且認證的小程序
2.一個H5站點
3.二維碼參數生成參數為: ?id=xx
4.到微信小程序后臺 配置 掃普通鏈接二維碼打開小程序 【規則自己理一理】
配置參考:
H5 站點
配置的規則 /mini
測試的配置 /mini?id=xxx
我使用的是快速搭建H5+微信小程序測試
onLoad(options) {
// console.log(options)
//q這里是 測試配置的完成url

if(options.q){
this.id=decodeURIComponent(options.q).split('=')[1]
// 你的業務邏輯
}
}
使用方案三的優勢在于:只需要關注微信小程序不出問題,其他瀏覽器或是應用打開基本之后走H5,并在H5展示,使用微信掃描,直接可以打開小程序
具體注意事項,可參考微信小程序開發者文檔;也可以留言
上一期:批量生成二維碼,并展示板塊,有一個更好的解決方案是,后端直接放回格式的數據,前端只需要渲染。完美解決