微信小程序base64与十六进制相互转换(使用btoa、atob方法报undefined)

前言:搜到很多方法都用到了btoa()、atob(),这两个属于Window 对象,在浏览器端可以直接使用,但是在小程序里面使用会报undefined。看到uniapp和微信小程序官方文档都提供了下面两个api,就想着经过ArrayBuffer 对象转换一下。

uni.base64ToArrayBuffer(base64)、wx.base64ToArrayBuffer(base64)

将 Base64 字符串转成 ArrayBuffer 对象

uni.arrayBufferToBase64(arrayBuffer)、wx.arrayBufferToBase64(arrayBuffer)

将 ArrayBuffer 对象转成 Base64 字符串

javascript 复制代码
<script>
	export default {
		onShow() {
			let str = 'ksPNPc/9opXh3S7DBF+tJMvB3ybDtVjuip327aoYkrGEX3JXI1FxcbI4Fn/rScqgRdXwfUYyLK3yL2AQdHPelJWzx4u7xfj4JpfWag9lkaZubQnI3w9QqKtb9Dqwl771jqut8MJL338A8Zh7buOh9DXBNi1CZBGVVUN5zqmd/IyyhYo1CWyaFSGsaYSO7+xsEswQg8n2vLM6m7yFqL70/pV4eIsKtj5VDoTYphPanFEssWNt9Do4+cL6EUTQKC2XhrEeoZBI7iRWDzde3qzdwFPwUnb2Uxyo9E9Qg+CFvxtfFcB6D9G5+Nh9bbL6RfWgvmXgTxDqfl2Ynf4BWP6m1A=='
			let _hex = this.base64ToHex(str);
			console.log(this.hexToBase64(_hex) === str); // true
		},
		methods: {
			// base64转为十六进制
			base64ToHex(str) {
				const buffer = uni.base64ToArrayBuffer(str);
				// 或:const buffer = wx.base64ToArrayBuffer(str);
				return Array.prototype.map.call(new Uint8Array(buffer), x => ('00' +
					x.toString(16)).slice(-2)).join('');
			},
			// 十六进制转为base64
			hexToBase64(str) {
				const uint8Array = new Uint8Array(str.match(/.{1,2}/g).map(byte => parseInt(byte, 16)));
				return uni.arrayBufferToBase64(uint8Array);
				// 或:return wx.arrayBufferToBase64(uint8Array);
			}
		}
	}
</script>
相关推荐
2501_915921435 小时前
iOS App 电耗管理 通过系统电池记录、Xcode Instruments 与克魔(KeyMob)组合使用
android·ios·小程序·https·uni-app·iphone·webview
数字游民95277 小时前
2小时VibeCoding了一个看图猜词小程序:猜对了么
人工智能·ai·小程序·ai绘画·数字游民9527
qq_124987075312 小时前
基于小程序中医食谱推荐系统的设计(源码+论文+部署+安装)
java·spring boot·后端·微信小程序·小程序·毕业设计·计算机毕业设计
2501_9159184116 小时前
iOS App 测试方法,Xcode、TestFlight与克魔(KeyMob)等工具组合使用
android·macos·ios·小程序·uni-app·iphone·xcode
棒棒的唐16 小时前
微信小程序右上角分享按钮如何根据用户登录状态确定是否允许分享
微信小程序·小程序
2501_9159214317 小时前
iOS 描述文件制作过程,从 Bundle ID、证书、设备到描述文件生成后的验证
android·ios·小程序·https·uni-app·iphone·webview
小白学大数据17 小时前
基于 Python 的知网文献批量采集与可视化分析
开发语言·爬虫·python·小程序
毕设源码-郭学长17 小时前
【开题答辩全过程】以 基于微信小程序的医院管理系统为例,包含答辩的问题和答案
微信小程序·小程序
毕设源码-朱学姐17 小时前
【开题答辩全过程】以 基于微信小程序的医疗物资进销存管理为例,包含答辩的问题和答案
微信小程序·小程序
低代码布道师18 小时前
教培管家第06讲:搭建销售工作台——公海争夺与私海管理
低代码·小程序·云开发