微信小程序读取nfc获取Ndef写入的数据
提示:以下是本篇文章正文内容,下面案例可供参考
1.新建一个utils工具类里面新建utils.js文件
代码如下(示例):上面有一点事转换时间的不需要可以自己删掉
const formatTime = date => {
const year = date.getFullYear()
const month = date.getMonth() + 1
const 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 = arr
for (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].length
var 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 | 0
d = 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进制转化为ArrayBuffer
return 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 = 0
interval = interval || 1000
// 将throttle处理结果当作函数返回
return function () {
// 保留调用时的this上下文
let context = this
// 保留调用时传入的参数
let args = arguments
// 记录本次触发回调的时间
let now = +new Date()
// 判断上次触发的时间和本次触发的时间差是否小于时间间隔的阈值
if (now - last >= interval) {
// 如果时间间隔大于我们设定的时间间隔阈值,则执行回调
last = now
fn.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.platform
if (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;
}