weapp-qrcode icon indicating copy to clipboard operation
weapp-qrcode copied to clipboard

真机生成的二维码错乱

Open EverChan6 opened this issue 5 years ago • 9 comments

Description

真机生成的二维码错乱,导致无法识别。微信开发者工具生成的是好的。

Environment

  • Platform: [开发者工具/iOS/Andriod/Web] 开发者工具
  • Platform version: [对应工具或者iOS或者Andriod的版本号] 微信开发者工具 Stable v1.02.1910120
  • Wechat version: [微信版本号] Version 7.0.8
  • weapp-qrcode version: [在package.json里] v1.0.0
  • other version: [如果在某一设备下出现该问题,请填写设备号] 华为nova3i Android版本:9

Reproduce

问题复现步骤:

  1. 点击该静态图片
  2. 前端生成二维码,然后用小程序api的canvasToTempFilePath来生成临时图片路径,再previewImage该二维码

期望的表现:

希望真机和开发者工具一样生成正常可用的二维码

观察到的表现:

华为手机真机测试,生成的二维码定位符错乱不完整导致无法识别

屏幕截图和动态 GIF 图 真机上生成的二维码

![复现步骤的屏幕截图和动态 GIF 图](图片的 url)

Relevant Code / Logs

<canvas class="canvas-style" :style="{width: cwidth + 'px', height: cheight + 'px'}" canvas-id="qrcode"></canvas>
data () {
    return {
         cwidth: 200,
         cheight: 200,
         tempFilePath: '',
    }
}
                       /**
			 * 展示二维码
			 * @param {Object} idx
			 */
			async showCode(idx) {
				// 绘制二维码
				await this.genQrcode(this.list[idx].url)
				// canvas转为图片
				await canvasToTempFilePath({x: 0, y: 0, width: this.cwidth, height: this.cheight, destWidth: this.cwidth, destHeight: this.cheight, canvasId: 'qrcode'}).then(res => {
					// console.log(res.tempFilePath)
					this.tempFilePath = res.tempFilePath
				}).catch(err => {
					console.log(err)
				})
				// 预览图片,并可转发分享、保存到本地等
				previewImage({current: this.tempFilePath, urls: [this.tempFilePath]}).then(res => {
					
				}).catch(err => {
					console.log(err)
				})
			},
			
			/**
			 * 生成二维码
			 */
			genQrcode(url) {
				// console.log(typeof drawQrcode)
				return new Promise((resolve, reject) => {
					try {
						drawQrcode({
							width: this.cwidth,
							height: this.cheight,
							canvasId: 'qrcode',
							// ctx: uni.createCanvasContext('qrcode'),
							text: url,
							callback: (e) => {
								console.log(e)
								resolve()
							}
						})
					} catch (e) {
						console.log(e)
						//TODO handle the exception
						reject()
					}
				})
			},

EverChan6 avatar Nov 21 '19 03:11 EverChan6

出现情况相同,猜测是二维码的定位框绘制有问题,求解决

SirusChen avatar Dec 25 '19 01:12 SirusChen

一样。。开发者工具可以,真机不行

gjqiang avatar Jan 07 '20 06:01 gjqiang

整了一天确认真机大概率有问题,vivo 855 plus ,,故不得不放弃此库~~

feixue1232 avatar Mar 29 '20 14:03 feixue1232

生成的识别不了,已弃库

JBPatric avatar Dec 15 '20 06:12 JBPatric

生成的识别不了,已弃库

换成哪个库了?

coderew avatar Aug 03 '22 03:08 coderew

我也遇到了,参考这个文档在callback中设置定时器,可以解决 https://developers.weixin.qq.com/community/develop/article/doc/00002064e6c920917be96c1ed56013?page=1#comment-list

pandaSeven avatar Jun 13 '23 07:06 pandaSeven

您好,您的邮件已收到。 谢谢

JBPatric avatar Jun 13 '23 07:06 JBPatric