微信小程序官方文档中提供了调用NFC功能的基础库:

NFC - wx.getNFCAdapter - 《微信小程序官方开发文档(全) - 20210305》 - 书栈网 · BookStackNFCAdapter wx.getNFCAdapter()返回值NFCAdapter错误示例代码 微信小程序提供了一个简单、高效的应用开发框架和丰富的组件及API,帮助开发者在微信中开发具有原生 APP 体验的服务。本手册整理于2021年3月份,内容包含微信小程序开发指南、微信小程序框架、微信小程序组件、微信小程序API、微信小程序服务端文档、微信小程序开飞工具、微信小程序云开发以及微信小程序扩icon-default.png?t=M4ADhttps://www.bookstack.cn/read/miniprogram-guide-20210305/04db66f176e57bc8.md方便我们直接在uniapp小程序中直接调用NFC的功能

所以我们在用到NFC读取功能的页面中,写一个方法把NFC相关权限进行打开,写在methods中:

testNFC() {
				const nfc = wx.getNFCAdapter()
				this.nfc = nfc
				let _this = this

				function discoverHandler(res) {
					const data = new Uint8Array(res.id)
					let str = ""
					data.forEach(e => {
						let item = e.toString(16)
						if (item.length == 1) {
							item = '0' + item
						}
						item = item.toUpperCase()
						str += item
					})
					/* 这里获取的str就是我们读取出的UID码了 */
					
					/* ------这里是我的项目中拿到NFC的UID码之后的业务逻辑,可以忽略------ */
					if (str) {
						uni.showLoading({
							title: '解析中'
						});
					}
					/* ------------------------------------------------------------------ */
				}
				nfc.startDiscovery({
					success(res) {
						uni.showToast({
							title: 'NFC读取功能已开启!',
							icon: 'none'
						})
						nfc.onDiscovered(discoverHandler)
					},
					fail(err) {
						if (!err.errCode) {
							uni.showToast({
								title: '请检查NFC功能是否正常!',
								icon: 'none'
							})
							return
						}
					}
				})
			},

因为我们想要在打开当前页面后,就可以直接用手机读取NFC码,不需要其他的动作进行触发,所以我们在页面加载的时候,就调用上面的testNFC方法:

mounted() {
			this.testNFC()
		},

效果:

打开当前页面后,有NFC功能的手机会进行NFC相关功能权限的授权,会提示“NFC读取功能已开启!”

把NFC标签靠近手机NFC感应器,就可以正确获取UID码了。

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐