扫描二维码 打开 小程序或是H5网页

最近在做一个的项目，有一个需求是扫码查看信息详情

扫描的情况可能是使用微信扫描，或是其他扫描

如果是微信扫描，则跳转到对应的小程序，

如果非微信扫码，这进入H5展示详细信息

 

目前需要解决的难题有一下几个：

1. 微信扫码如何进入小程序
2. 如果不是微信扫码，如何跳转到H5展示
3. 生成二维码的数据该放那些内容

围绕以上问题；有一下接的几个方案可以解决

方案一：H5+微信小程序urlScheme

方案二：H5+微信小程序的普通二维码跳转小程序

方案三：使用微信小程序生成无限制二维码

首先去掉第三个方案，因为微信小程序二维码无法条状到H5，如果用浏览器扫描，则查看不了内容

其次去掉第二个方案，每个小程序urlScheme生成数量有限，10万封顶，这对于生成批量的二维码业务来说，早晚是会出问题的。不过在这里也简单描述一些，功能的实现：

前期准备

1.一个上线并且认证的小程序

2.一个H5站点

3.二维码参数生成参数为: xxx.com?id=xx

4.扫码后获取id 通过id 查询数据，并通过服务端生成对应的urlScheme（openlink） 一并放回来给前端

5.判断是否为微信环境 如果是微信环境 

是:跳转window.localtion.herf=openlink

否:在H5端展示资产详情

方案二：是最简单，也是可以解决当前问题的最佳选择

前期准备：

1.一个上线并且认证的小程序

2.一个H5站点 xxx.com

3.二维码参数生成参数为: xxx.com?id=xx

4.到微信小程序后台 配置 扫普通链接二维码打开小程序 【规则自己理一理】

配置参考：

H5 站点 xxx.com

配置的规则 xxx.com/mini

测试的配置 xxx.com/mini?id=xxx

我使用的是uniapp快速搭建H5+微信小程序测试

onLoad(options) {
	// console.log(options)
    //q这里是 测试配置的完成url  
	if(options.q){
		this.id=decodeURIComponent(options.q).split('=')[1]
		// 你的业务逻辑
	}
}

使用方案三的优势在于：只需要关注微信小程序不出问题，其他浏览器或是应用打开基本之后走H5，并在H5展示，使用微信扫描，直接可以打开小程序

具体注意事项，可参考微信小程序开发者文档；也可以留言

 

上一期：批量生成二维码，并展示板块，有一个更好的解决方案是，后端直接放回base64格式的数据，前端只需要渲染。完美解决