uni-app h5 扫一扫

在使用uni-app开发微信公众号（H5）时，基本上都需要用到微信的JSSDK。

首先，先下载js，地址： https://unpkg.com/jweixin-module@1.4.1/out/index.js

然后在项目根目录新建一个jweixin文件夹，把下载下来的js放到此文件夹下面。

接着就是使用了，在你需要使用的页面中引入：

const jweixin = require('../../jweixin')

使用微信 js-sdk 的时候，都需要通过config接口注入权限验证配置。所以需要先调用后台接口获取config配置：

async getConfig() {let [error, res] = await uni.request({url: '/api/api/WXJSSDK/GetConfig',method: 'GET',data: {url: location.href}})let s = res.datajweixin.config({debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。appId: s.appId, // 必填，公众号的唯一标识timestamp: s.timestamp, // 必填，生成签名的时间戳nonceStr: s.nonceStr, // 必填，生成签名的随机串signature: s.signature, // 必填，签名jsApiList: ["onMenuShareTimeline", "onMenuShareAppMessage", "scanQRCode"] // 必填，需要使用的JS接口列表});},

然后再onLoad中调用：

        async onLoad() {await this.getConfig()},

最后给扫一扫添加点击事件：

            scan() {const _this = thisjweixin.scanQRCode({needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，scanType: ["qrCode", "barCode"], // 可以指定扫二维码还是一维码，默认二者都有success: function (res) {let str = res.resultStr; // 当needResult 为 1 时，扫码返回的结果console.log(str)}});}

uni-app h5 扫一扫相关推荐

uni App+H5 实现人脸识别
uni App+H5 实现人脸识别通过h5的视频video管理设备摄像头(不要关),在打开视频摄像时快照截取人脸照片传送到后台通过API接口调用百度人脸识别结果并通过返回数据解析自己业务需求. 1. ...
uni app(H5)中软键盘弹出,固定定位绝对定位元素位置发生错乱
一.问题如下最近用uni app写项目,发现H5软键盘弹起,导致我固定定位的按钮被顶了上去,如图二.解决方法 1.让其在输入框获取焦点时隐藏百度了许多,有让输入框获取焦点时让按钮隐藏的方法,失去 ...
uni.app H5(微信公众号定位) uni.getLocation
最近在开发公众号,由于之前经常使用uni,app写APP,索性就用uni.app来开发公众号了, 不过也遇到了一个问题,就是在公众号的首页要获取用户的定位.我看了看官网的API 有个uni.getLo ...
uniapp微信公众号h5开发--（微信开发回调、背景音乐自动播放、微信朋友分享、微信扫一扫）一站式踩坑
微信公众号开发,一站式踩坑开发前提:例如你们域名是https://www.baidu.com 配置nginx反向代理,把你项目的端口重定向到你们测试环境或线上环境域名 # 访问https://bai ...
手机H5支付和扫码支付的区别是什么？
H5支付就是网页发起的微信.支付宝唤醒,通过微信自带的微信浏览器内jssdk发起的微信支付.支付宝也可以拉起手机浏览器唤醒支付宝发起支付宝支付. 扫码支付即通过手机app进行扫码付款,最常用的软件如微 ...
uniapp 在h5 模式下扫码
uniapp 在h5下是不支持扫码功能只能自己找api去搞 qrcode.js 解析二维码(源码)https://blog.csdn.net/z_jing0927/article/details/1 ...
uni-app微信H5微信扫一扫支持安卓跟苹果
下载微信JSSDK https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#1 先登录微信公众平台进入&quo ...
微信公众号H5页面实现扫一扫功能
uniappH5实现扫一扫功能最近遇到一个需求,H5页面使用扫码绑定设备功能,因为uniapp uni.scanCode API H5不支持,网上找了很多方案不合适,因为这个项目是在公众里面运行的, ...
公众号开发-移动端h5页面调用微信扫一扫
前言: 大家好,我是前端小陈.今天为大家讲一下微信公众号开发,调用微信的JSSDK的案例. 前不久,接到这么一个需求:在H5网页实现扫一扫功能. 要求:微信端以及浏览器均可以实现扫一扫功能,而且不能 ...
【H5唤起微信“扫一扫”】舒工自定义微信H5唤起扫码Vue组件sg-scan.vue（扫码按钮大概是在底部），注意只是代码片段，不含微信鉴权业务流程
 <template><div class="sg-scan" :up=&q ...

uni-app h5 扫一扫

uni-app h5 扫一扫相关推荐

最新文章

热门文章