微信小程序实现条形码,二维码生成和微信小程序扫码

一:条形码,二维码生成

在微信小程序中生成条形码和二维码需要使用到wxbarcode的npm包,wxbarcode的npm包地址:https://www.npmjs.com/package/wxbarcode

1:安装wxbarcode

npm i wxbarcode -S --production

在微信小程序项目中使用npm包参考:https://www.wj0511.com/site/detail.html?id=366

2:条形码和二维码生成

(1)引入wxbarcode包

在你需要生成条形码和二维码页面的js中引入exbarcode包

import wxbarcode from 'wxbarcode'

或:

const wxbarcode = require('wxbarcode')

(2)条形码生成

在wxbarcode包中生成条形码使用到了barcode函数,barcode的函数原型为:

barcode(id, code, width, height)

参数说明:

id: wxml文件中的 Canvas ID

code: 用于生成条形码的字符串

width: 生成的条形码宽度,单位 rpx

height: 生成的条形码高度,单位 rpx

条形码生成实例:

wxml:

<canvas canvas-id="barcode" />

js:

onLoad: function (options) {wxbarcode.barcode('barcode', '1234567890123456789', 680, 200);
},

根据如上可实现条形码生成:

image.png

(3)二维码生成

在wxbarcode包中生成二维码使用到了qrcode函数,qrcode的函数原型为:

qrcode(id, code, width, height)

参数说明:

id: wxml文件中的 Canvas ID

code: 用于生成二维码的字符串

width: 生成的二维码宽度,单位 rpx

height: 生成的二维码高度,单位 rpx

二维码生成实例:

wxml:

<canvas canvas-id="qrcode" />

js:

onLoad: function (options) {wxbarcode.qrcode('qrcode', '1234567890123456789', 300, 300);
},

根据如上可实现二维码生成:

image.png

二:微信小程序扫码

微信小程序扫码使用到了微信自带的API:wx.scanCode(Object object)

wx.scanCode的参数:

onlyFromCamera:是否只能从相机扫码,不允许从相册选择图片,默认为false

scanType:扫码类型,默认为['barCode', 'qrCode'],参数可以为数组也可以为字符串,可选参数:barCode(一维码),qrCode(二维码),datamatrix(Data Matrix 码),pdf417(PDF417 条码 )

success:接口调用成功的回调函数,回调成功参数:result(所扫码的内容),scanType(所扫码的类型),charSet(所扫码的字符集),path(当所扫的码为当前小程序二维码时,会返回此字段,内容为二维码携带的 path),rawData(原始数据,base64编码)

fail:接口调用失败的回调函数

complete:接口调用结束的回调函数(调用成功、失败都会执行)

实例:

// 允许从相机和相册扫码
wx.scanCode({
success(res) {
//扫码成功执行
console.log(res)
},
fail(res) {
//扫码失败执行
console.log(res)
},
complete(res) {
//扫码结束执行
console.log(res)
}
})

如果你只允许拍照扫码的话你可以增加如下参数:

onlyFromCamera: true,

根据如上就可以实现微信小程序扫码

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/143082.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

转载:在微信小程序中 生成二维码

目录 转载&#xff1a; weapp-qrcode-canvas-2d 仓库地址 测试环境 使用 安装方法1&#xff1a;直接引入 js 文件 安装方法2&#xff1a;npm安装 安装完成后调用 例子1&#xff1a;没有使用叠加图片 例子2&#xff1a;使用叠加图片(在二维码中加logo) 这里是API dr…

前端生成二维码 微信小程序

1&#xff0c;在微信开发者工具里面引入npm命令“ npm install weapp-qrcode --save ”&#xff1b; 2&#xff0c;将 dist 目录下的weapp.qrcode.esm.js 复制到项目的utils目录中&#xff1b; 3&#xff0c;在所需的index.js页面引入weapp.qrcode文件。并调用drawQrcode()方法…

微信小程序生成自定义参数二维码

微信小程序生成自定义参数二维码 前言实现尾巴 前言 最近项目中要用到二维码分享功能&#xff0c;需要封装一些自定义的参数通过二维码分享。查看官方文档&#xff0c;发现系统提供了生成二维码的功能&#xff0c;但是细看才发现官方提供的接口其实是生成小程序二维码&#xf…

微信小程序内,生成自定义二维码

最近在开发中&#xff0c;需要生成自定义的二维码&#xff0c;于是做了一个包出来&#xff0c;分享给大家一起使用。适用于微信小程序的二维码生成器&#xff0c;基于Canvas生成&#xff0c;支持中文的输入。可在原生小程序&#xff0c;mpvue&#xff0c;taro中使用。&#xff…

微信小程序实战教程1503---生成二维码

在微信小程序中&#xff0c;如果我们可以自己将指定内容生成二维码&#xff0c;出示给别人&#xff0c;将是一个比较有用的功能。但是微信小程序API中&#xff0c;目前暂时还没有这个功能&#xff0c;但是我们可以通过变通的方法&#xff0c;来实现这一功能。 本文所提到的方法…

记一次 Android 源码编译刷机过程

0 背景 为了能在开发设备上运行 adb root 命令得到 root 权限&#xff0c;获得更加强大的调试能力、开发体验&#xff0c;方便以后阅读源码时 Debug 跟踪、进行定制化开发&#xff0c;需要编译 Android 源码 userdebug 版本并刷入手机当中。 1 准备 1.1 硬盘 首先 Android 源…

JavaScript 基础 DOM (四)

正则表达式正则表达式 正则基本使用 定义规则 const reg /表达式/其中/ /是正则表达式字面量正则表达式也是对象 使用正则 test()方法 用来查看正则表达式与指定的字符串是否匹配 如果正则表达式与指定的字符串匹配 &#xff0c;返回true&#xff0c;否则false reg.test(…

苹果id怎么注册?老果粉教你创建新的Apple ID

苹果ID怎么注册&#xff1f;苹果ID又叫做Apple ID&#xff0c;这是我们用来访问Apple服务的账号&#xff0c;包括iCloud、App Store在内的苹果手机自带应用都需要我们登陆Apple ID才可以正常使用。该账号不仅仅只是一个登录账号&#xff0c;其中包含了我们大量的隐私信息&#…

如何重新设置苹果id密码_ios游戏apple账号分享韩国苹果id密码大全

韩区id申请注册流程和在国内申请注册账号流程不一样&#xff0c;所选地区和填写信息要求不一样&#xff0c;现在很多游戏或者其他软件只能在日本地区发行&#xff0c;想要下载这些软件就必须要注册日本地区的id账号就能下载。 申请注册韩区id除了要注意选择地区之外&#xff0c…

苹果注册会员账号

下面介绍个人开发者账号申请流程 1.1首先打开苹果开发者中心 如果已经注册过apple id&#xff0c;跳过注册&#xff0c;直接看后面步骤登录开发者中心申请&#xff01; 点击立即创建您的apple id 2、跳转到apple id申请页面填写相关信息 名字用汉字或者拼音写上去&#xff08;注…

苹果开发者公司账号注册流程注册新的苹果Apple Id并双重验证步骤

大概分为几个步骤&#xff1a; 1.需要一个未注册过开发者的苹果Apple Id &#xff08;如果没有重新注册详见下文&#xff09; 2.Apple Id需要开通双重验证 &#xff08;详见下文&#xff09; 3.申请公司的邓白氏码 申请流程&#xff1a;https://www.jianshu.com/p/31b7aa616…

Apple ID 的申请流程

Apple ID 申请可以在通过PC端申请也可以在IOS系统的手机上申请。本节就说说在PC端的申请流程。 1、打开苹果帐户注册网站&#xff1a;appleid.apple.com/cn&#xff0c;然后点击右上角的“创建 Apple ID” 2、按照提示填写对应的信息 回答的问题注意字符要大于等于3 然后…

苹果礼品卡导致Apple ID被封,怎么避免?

下载外区的苹果App常常需要买外区对应国家的礼品卡&#xff0c;尤其是玩游戏&#xff0c;我们游戏工会里面时不时有人的Apple ID被封&#xff0c;经历多了经验也就慢慢丰富了&#xff0c;后来在群里就专门强调几点注意事项&#xff0c;经过一年验证完全有效&#xff0c;基本上杜…

此apple id尚未用于App Store(如需帮助,请联系iTunes支持,网址www.apple.com/support/itunes/ww/)

使用MacBook Pro做开发&#xff0c;结果新注册的Apple ID在登录App Store的时候出现此apple id尚未用于App Store 填写相关信息时出现如需帮助&#xff0c;请联系iTunes支持&#xff0c;网址www.apple.com/support/itunes/ww/&#xff0c;如图&#xff1a; 解决办法&#x…

最新Apple苹果开发者账号AppleID注册流程

1、登陆开发者官网&#xff1a; https://developer.apple.com/ 2、如果有苹果设备&#xff0c;可以直接使用你设备的appleID&#xff0c;后面的步骤一样的&#xff0c;这是少了这个注册过程。下面说说没有appleID的注册流程。 点击开发者官网右上角account,进入开发者登陆页…

python加密算法

首先加密算法要引入hashlib模块&#xff0c;在python中用import hashlib引入 接下来如果要对一串数字进行加密操作如下 这里用a变量来接接收&#xff0c;md5里的数字就是要加密的内容 然后再内容后面加上.encode&#xff08;“utf-8”&#xff09;因为hashlib是对二进制进行…

python 代码加密

Python代码加密步骤 1、准备文件 main.py为要加密的主脚本import sys from PyQt5.QtWidgets import QApplication, QWidgetdef show_w():显示窗口app QApplication(sys.argv) # 所有的PyQt5应用必须创建一个应用&#xff08;Application&#xff09;对象。# sys.argv参数是一个…

python 加密-对exe加密

Python 是一种面向对象的解释型计算机程序设计语言&#xff0c;Python 语言写的程序不需要编译成二进制代码&#xff0c;可以直接从源代码运行程序。 在计算机内部&#xff0c;Python解释器把源代码转换成称为字节的中间形式&#xff0c;然后再它翻译计算机使用的机器语言并运行…

python封装成dll_Python加密成.so或dll

Python加密 如何封装Python代码&#xff0c;让别人方便调用&#xff0c;同时又能起到加密的作用&#xff0c;本文介绍如何封装成so文件和dll文件以及调用方式 首先需要配置环境 安装Cython gcc Linux下的.so文件 创建要封装的文件mytest.py import datetime class DataCe…

Python加密生成so文件与dll

Python加密 如何封装Python代码&#xff0c;让别人方便调用&#xff0c;同时又能起到加密的作用&#xff0c;本文介绍如何封装成so文件和dll文件以及调用方式 首先需要配置环境 安装Cython gcc Linux下的.so文件 创建要封装的文件mytest.py import datetime class DataCen…