微信小程序读取nfc获取Ndef写入的数据

微信小程序读取nfc获取Ndef写入的数据

文章目录

1.新建一个utils工具类里面新建utils.js文件
2.在add.json里面新建页面
3.代码如下（示例）：nfc.wxml
4.代码如下（示例）：nfc.wxss

提示：以下是本篇文章正文内容，下面案例可供参考

1.新建一个utils工具类里面新建utils.js文件

代码如下（示例）：上面有一点事转换时间的不需要可以自己删掉

const formatTime = date => {const year = date.getFullYear()const month = date.getMonth() + 1const day = date.getDate()const hour = date.getHours()const minute = date.getMinutes()const second = date.getSeconds()// return `${[year, month, day].map(formatNumber).join('/')} ${[hour, minute, second].map(formatNumber).join(':')}`return `${[year, month, day].map(formatNumber).join('/')}`
}const formatNumber = n => {n = n.toString()return n[1] ? n : `0${n}`
}module.exports = {formatTime
}/*** 字节对象转字符串* @param {Object} arr*/
export const byteToString = function (arr) {if (typeof arr === 'string') {return arr}var str = '',_arr = arrfor (var i = 0; i < _arr.length; i++) {var one = _arr[i].toString(2),v = one.match(/^1+?(?=0)/)if (v && one.length == 8) {var bytesLength = v[0].lengthvar store = _arr[i].toString(2).slice(7 - bytesLength)for (var st = 1; st < bytesLength; st++) {store += _arr[st + i].toString(2).slice(2)}str += String.fromCharCode(parseInt(store, 2))i += bytesLength - 1} else {str += String.fromCharCode(_arr[i])}}return str
}/*** 检验数据是否为空*/
export const isEmpty = obj => {if (obj === '' || obj === null || obj === undefined) {return true} else if (obj.constructor === Array && obj.length === 0) {return true} else if (obj.constructor === Object && Object.keys(obj).length === 0) {return true} else {return false}
}/*** 生成UUID*/
export const generateUUID = () => {let d = new Date().getTime()let uuid = 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {// let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {let r = (d + Math.random() * 16) % 16 | 0d = Math.floor(d / 16)return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16)})return uuid
}/*** 字符串转字节* @param {Object} str*/
export const stringToArrayBuffer = function (str) {// 首先将字符串转为16进制let val = ''for (let i = 0; i < str.length; i++) {if (val === '') {val = str.charCodeAt(i).toString(16)} else {val += ',' + str.charCodeAt(i).toString(16)}}// 将16进制转化为ArrayBufferreturn new Uint8Array(val.match(/[\da-f]{2}/gi).map(function (h) {return parseInt(h, 16)})).buffer
}/*** 移除空字符*/
export const removeNullCharacter = str => {return str.replace(/\\u([0-9]|[a-fA-F])([0-9]|[a-fA-F])([0-9]|[a-fA-F])([0-9]|[a-fA-F])/g, '')
}/*** 格式化空字符为空字符串*/
export const formatNullCharacter = str => {if (!str) return ''return JSON.parse(removeNullCharacter(JSON.stringify(str)))
}/*** 节流函数* fn是我们需要包装的事件回调, interval是时间间隔的阈值*/
export const throttle = (fn, interval) => {// last为上一次触发回调的时间let last = 0interval = interval || 1000// 将throttle处理结果当作函数返回return function () {// 保留调用时的this上下文let context = this// 保留调用时传入的参数let args = arguments// 记录本次触发回调的时间let now = +new Date()// 判断上次触发的时间和本次触发的时间差是否小于时间间隔的阈值if (now - last >= interval) {// 如果时间间隔大于我们设定的时间间隔阈值，则执行回调last = nowfn.apply(context, args)}}
}/*** 格式化得到aid值* @param {Object} buffer*/
// export const ab2hex = function (buffer) {//   var hexArr = Array.prototype.map.call(
//     new Uint8Array(buffer),//     function (bit) {//       return ('00' + bit.toString(16)).slice(-2);
//     }
//   );
//   return hexArr.join('');
// };

2.在add.json里面新建页面

代码如下（示例）：我建的是"pages/NFC/NFC",nfc.js

import { byteToString, isEmpty, formatNullCharacter } from '../../utils/util'
const app = getApp()Page({NFCAdapter: null,aaa: [],data: {nfcInfo: {},msgTitle: '',typeText: { U: '网址', T: '文本' }},onShow: function () {this.onInit()},onInit() {const platform = app.globalData.platformif (platform == 'android') {this.NFCAdapter = wx.getNFCAdapter()this.NFClistener()} else {if (platform != 'devtools') {wx.showModal({title: '提示',content: '小程序NFC官方暂仅支持安卓设备',confirmColor: '#d93e4b',confirmText: '确定',showCancel: false})}this.setData({msgTitle: '小程序NFC官方暂仅支持安卓设备'})}},/*** 开始监听 NFC*/NFClistener() {this.NFCAdapter.startDiscovery({success: () => {this.setData({msgTitle: '请将设备放入识别区NFC',msgContent: ''})// 监听 NFC 标签this.NFCAdapter.onDiscovered(this.discoverHandler)},fail: error => {this.setData({msgTitle: '请重试'})console.error(error)}})},/*** 监听回调*/discoverHandler(callback) {console.log('==================== START ====================')// console.log('callback.messages[0].records[0]', callback.messages[0].records[0].payload)//获取ArrayBuffer var buffer = callback.messages[0].records[0].payload;//获取Uint8Array var dataview = new DataView(buffer);console.log('dataview', dataview)//获取Uint8Array数组var ints = new Uint8Array(buffer);console.log('ints', ints)//截取数组var shuzu = ints.slice(3);console.log('shuzu',shuzu)// 编译Uint8Array数组let unit8Arr = new Uint8Array(shuzu);let encodedString = String.fromCharCode.apply(null, unit8Arr),// 处理中文乱码decodedString = decodeURIComponent(escape((encodedString)));// 赋值this.setData({ aaa: decodedString })},/*** 注销 NFCAdapter*/onHide() {this.closeNFC()},onUnload: function () {this.closeNFC()}
})

3.代码如下（示例）：nfc.wxml

<view class="page"><view class="ndef-box" bindtap="onClickNDEFContent"><view class="title">NDEF信息</view><view class="content"><view class="label">类型描述：</view><view>{{ aaa }}</view></view></view>
</view>

4.代码如下（示例）：nfc.wxss

.page {padding: 20px;box-sizing: border-box;background-color: #f1f1f1;height: 100vh;
}.msg-box {min-height: 300rpx;border-radius: 30rpx;overflow: hidden;background-color: #fff;margin-bottom: 30rpx;
}.msg-box .text {text-align: center;line-height: 40rpx;padding: 20rpx;font-size: 28rpx;color: #333;
}.ndef-box {border-radius: 30rpx;overflow: hidden;min-height: 500rpx;padding-bottom: 10px;background-color: #fff;
}.msg-box .title,
.ndef-box .title {font-weight: 700;text-align: center;line-height: 100rpx;border-bottom: 1px solid #f2f2f2;
}.ndef-box .content {display: flex;padding: 10px;font-size: 28rpx;line-height: 36rpx;
}.ndef-box .content .label {font-weight: 700;min-width: 90rpx;
}.ndef-box .placeholder {line-height: 188rpx;text-align: center;color: #666;font-size: 28rpx;
}

微信小程序读取nfc获取Ndef写入的数据相关推荐

微信小程序读取NFC卡片数据，NDEF-M1
最近来了个离谱的需求,要用微信小程序读写NFC卡数据,微信官方文档可以说是垃圾的一批了,啥都没有,踩了好几天坑把整体思路记录一下. 首先调用微信自带的方法 const adapter = wx.get ...
微信小程序通过data-xxx获取不到dataset数据
data-xxx:xxx部分,如果你写了驼峰,实际上小程序在保存的时候,全部给变成小写了,所以你用驼峰接收,接收不到! 例如此处如果你写houseId 你只能通过lowcase以后才能获取到你想要的数 ...
微信小程序接入NFC，使用HCE模拟主机卡完成NFC刷卡发送消息
NFC相信大家都很熟悉,现实中经常使用的门禁卡,公交卡,地铁卡,饭卡等都是采用NFC功能,那么你知道吗,NFC也可以用微信小程序来实现.使用微信小程序可以读取/写入让手机成为一个刷卡器,也可以使用微信 ...
[技术博客] 微信小程序的formid获取
微信小程序的formid获取 formId的触发微信小程序可以通过收集用户的formid,获取formid给用户主动推送微信消息.获取formid有两个途径,一个是触发一次表单提交,或者触发一次支付 ...
微信小程序view动态长度_微信小程序实现动态获取元素宽高的方法分析
本文实例讲述了微信小程序实现动态获取元素宽高的方法.分享给大家供大家参考,具体如下: 我以前一直以为微信小程序不能动态获取view元素的宽高.但是自从看到: wx.createSelectorQuer ...
微信小程序-从相册获取图片,视频使用相机拍照,录像上传+服务器(nodejs版)接收
在本文微信小程序-从相册获取图片使用相机拍照本地图片上传之前需要看看微信小程序-获取用户session_key,openid,unionid - 后端为nodejs 代码封装是在上文添加的. ...
微信小程序——读取显示用户头像昵称
微信小程序--读取显示用户头像昵称代码仓库地址一.实验目标 1.学习使用快速启动模板创建小程序的方法: 2.学习不使用模板手动创建小程序的方法. 二.实验步骤 2.1 自动生成小程序完成开发者注 ...
微信小程录制视频上传服务器,微信小程序-从相册获取图片,视频使用相机拍照,录像上传+服务器nodejs版接收-微信小程序视频上传功能-微信小程序视频上传...
在本文微信小程序-从相册获取图片使用相机拍照本地图片上传之前需要看看微信小程序-获取用户session_key,openid,unionid-后端为nodejs代码封装是在上文添加的.本文知识点:1. ...
微信中html5获取手机号,微信小程序用户授权获取手机号（getPhoneNumber）
前言小程序有一个获取用户很便捷的api,就是通过getPhoneNumber获取用户的已经绑定微信的手机号码.有一点要大家注意,现在微信和注重用户体验,有些方法都是需要用户主动去触发才能调用的,比如 ...

微信小程序读取nfc获取Ndef写入的数据

文章目录

1.新建一个utils工具类里面新建utils.js文件

2.在add.json里面新建页面

3.代码如下（示例）：nfc.wxml

4.代码如下（示例）：nfc.wxss

微信小程序读取nfc获取Ndef写入的数据相关推荐

最新文章

热门文章