From 5d26788c75b3f9c6ff458f7a4861a83555b31f7e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=98=BF=E4=B8=83?= Date: Wed, 7 Aug 2024 14:32:30 +0800 Subject: [PATCH] =?UTF-8?q?test:=E6=96=B0=E5=A2=9Ereact-native-quick-base6?= =?UTF-8?q?4=E6=B5=8B=E8=AF=95demo=20(#787)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../demo/QuickBase64Example.tsx | 423 +++++++++++++ .../tester/QuickBase64Test.tsx | 561 ++++++++++++++++++ 2 files changed, 984 insertions(+) create mode 100644 react-native-quick-base64/demo/QuickBase64Example.tsx create mode 100644 react-native-quick-base64/tester/QuickBase64Test.tsx diff --git a/react-native-quick-base64/demo/QuickBase64Example.tsx b/react-native-quick-base64/demo/QuickBase64Example.tsx new file mode 100644 index 00000000..420747bd --- /dev/null +++ b/react-native-quick-base64/demo/QuickBase64Example.tsx @@ -0,0 +1,423 @@ +/* + * MIT License + * + * Copyright (C) 2024 Huawei Device Co., Ltd. + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + */ + +import React, { useState } from 'react'; +import { Tester, TestSuite, TestCase } from '@rnoh/testerino'; +import { Text, View, TouchableHighlight, TextInput, ScrollView, StyleSheet } from 'react-native'; +import { byteLength, btoa, atob, toByteArray, fromByteArray, getNative, trimBase64Padding, shim } from '@react-native-oh-tpl/react-native-quick-base64'; + +type FuncBase64ToArrayBuffer = ( + data: string, + removeLinebreaks?: boolean +) => ArrayBuffer +type FuncBase64FromArrayBuffer = ( + data: string | ArrayBuffer, + urlSafe?: boolean +) => string + + +interface NativeModule { + base64FromArrayBuffer: FuncBase64FromArrayBuffer | undefined; + base64ToArrayBuffer: FuncBase64ToArrayBuffer | undefined; +} + +const PALETTE = { + REACT_CYAN_LIGHT: 'hsl(193, 95%, 68%)', + REACT_CYAN_DARK: 'hsl(193, 95%, 30%)', +}; + +function Button({ label, onPress }: { onPress: () => void; label: string }) { + return ( + + + {label} + + + ); +} + + +export function QuickBase64Test() { + // 测试字符串转base64 + const [textTobase64, onChangeTextToBase64] = React.useState(''); + + const [base64ToTextLength, onChangeBase64TextLength] = React.useState(0); + + const [base64ToText, onChangeBase64Text] = React.useState(''); + + const [byteArray, onChangeByteArray] = React.useState(new Uint8Array(0)); + + const [byteArrayRemove, onChangeByteArrayRemove] = React.useState(new Uint8Array(0)); + + const [fbArrayBase64Str, onChangeFbArrayBase64Str] = React.useState(''); + + const [fbArrayBase64StrUrlSafe, onChangeFbArrayBase64StrUrlSafe] = React.useState(''); + + const [testShimBtoA, onChangeTestShimBtoA] = React.useState(''); // 字符串转base64 + + const [testShimAtoB, onChangeTestShimAtoB] = React.useState(''); // base64转字符串 + + const [nativeModule, onChangeNativeModule] = React.useState({ + base64FromArrayBuffer: undefined, + base64ToArrayBuffer: undefined + }); + + const [nativeBFABText, onChangeNBFABText] = React.useState(''); + + const [nativeBFABTextUrlSafe, onChangeNBFABTextUrlSafe] = React.useState(''); + + const [nativeBTABText, onChangeNBTABText] = React.useState(new Uint8Array(0)); + + const [nativeBTABTextRemoveLinebreaks, onChangeNBTABTextRemoveLinebreaks] = React.useState(new Uint8Array(0)); + + const [trimBase64PaddingText, onChangeTrimBase64PaddingText] = React.useState(''); + + const byArray = new Uint8Array([72, 101, 108, 108, 111, 32, 87, 111, 114, 108, 100, 33]); + // 点击事件 字符串转base64 + const onPressBtoA = (text: string) => { + let b64 = btoa(text); + console.log(`字符串转base64 ${b64}`); + onChangeTextToBase64(b64) + } + + const [testText, onChangeTestText] = React.useState(''); + + // 点击事件 base64转字符串 + const onPressAtoB = (text: string) => { + let textA = atob(text); + console.log(`base64转字符串 ${textA}`); + onChangeBase64Text(textA) + } + + // 打印base64转为Unit8Array字节数组的长度 + const onPressBase64Length = (text: string) => { + console.log(`打印base64长度1 ${text}`); + onChangeBase64TextLength(byteLength(text)) + } + + /* toByteArray 把base64字符串解码为Uint8Array */ + const onPressToByteArray = (text: string) => { + let btArray = toByteArray(text); + console.log(`toByteArray ${btArray}`); + onChangeByteArray(btArray) + } + + /* toByteArray 把base64字符串解码为Uint8Array removeLinebreaks */ + const onPressToByteArrayRemove = (text: string, removeLinebreaks: boolean = false) => { + let btArray = toByteArray(text, removeLinebreaks); + console.log(`toByteArray ${btArray}`); + onChangeByteArrayRemove(btArray) + } + + /* fromByteArray 把Uint8Array编码为Base64字符串 */ + const onPressFromByteArray = ( + uint8: Uint8Array, + urlSafe: boolean = false) => { + let b64 = fromByteArray(uint8); + console.log(`fromByteArray ${b64}`); + onChangeFbArrayBase64Str(b64) + } + + /* fromByteArray 把Uint8Array编码为Base64字符串 */ + const onPressFromByteArrayUrlSafe = ( + uint8: Uint8Array, + urlSafe: boolean = false) => { + let b64 = fromByteArray(uint8, urlSafe); + console.log(`fromByteArray ${b64}`); + onChangeFbArrayBase64StrUrlSafe(b64) + } + + /* shim 给全局对象添加btoa和atob函数的shim实现 */ + const handleAddShimToGlobal = () => { + shim(); + console.log(typeof global.btoa); // 应该输出 "function" + console.log(typeof global.atob); // 同样应该输出 "function" + } + + const onPressTestShimBtoA = (text: string) => { + const encodeBase64 = global.btoa(text); + console.log(`shim global btoa ${encodeBase64}`); + onChangeTestShimBtoA(encodeBase64) + } + + const onPressTestShimAtoB = (text: string) => { + const decodeBase64 = global.atob(text); + console.log(`shim global atob ${decodeBase64}`); + onChangeTestShimAtoB(decodeBase64) + } + + /* trimBase64Padding 清除Base64字符串的填充字符 */ + const onPressTrimBase64Padding = (text: string) => { + let trimBase64 = trimBase64Padding(text); + console.log(`shim global atob ${trimBase64}`); + onChangeTrimBase64PaddingText(trimBase64) + } + + /* getNative 返回包含base64FromArrayBuffer和base64ToArrayBuffer函数的对象 */ + const onPressGetNative = () => { + const native = getNative() as NativeModule; + onChangeNativeModule(native) + } + + /** + * @param text + * base64FromArrayBuffer方法接受一个Base64编码的字符串或ArrayBuffer, + * 以及一个可选的布尔值参数,该参数决定是否生成的Base64字符串是URL安全的。 + * 这个方法将ArrayBuffer对象转换为Base64编码的字符串。 + * 这两个方法通常用于处理二进制数据,例如在网络传输或文件存储中,因为这些场景中的二进制数据需要被编码为文本格式以便于传输或存储。 + */ + const onPressNBFAB = (text: string | ArrayBuffer) => { + if (nativeModule?.base64FromArrayBuffer) { + let base64FromArrayBuffer = nativeModule.base64FromArrayBuffer(text); + onChangeNBFABText(base64FromArrayBuffer) + } + } + + /** + * @description base64转换Unit8Array 去除换行符 + * @param text + * @param removeLinebreaks true + * + */ + const onPressNBFABUrlSafe = (text: string | ArrayBuffer, urlSafe: boolean = false) => { + if (nativeModule?.base64FromArrayBuffer) { + let base64FromArrayBuffer = nativeModule.base64FromArrayBuffer(text, urlSafe); + onChangeNBFABTextUrlSafe(base64FromArrayBuffer) + } + } + + /** + * @description base64转换Unit8Array + * 这两个方法是用于处理Base64编码和ArrayBuffer之间的转换。 + * base64ToArrayBuffer方法接受一个Base64编码的字符串和一个可选的布尔值参数, + * 该参数决定是否在转换过程中删除换行符。这个方法将Base64编码的字符串转换为ArrayBuffer对象。 + * @param text + * @param removeLinebreaks 默认值 false + * + */ + const onPressNBTAB = (text: string) => { + if (nativeModule?.base64ToArrayBuffer) { + let base64ToArrayBuffer = new Uint8Array(nativeModule.base64ToArrayBuffer(text)); + onChangeNBTABText(base64ToArrayBuffer) + } + } + + /** + * @description base64转换Unit8Array 去除换行符 + * @param text + * @param removeLinebreaks true + * + */ + const onPressNBTABRemoveLinebreaks = (text: string, removeLinebreaks: boolean = false) => { + if (nativeModule?.base64ToArrayBuffer) { + let base64ToArrayBuffer = new Uint8Array(nativeModule.base64ToArrayBuffer(text, removeLinebreaks)); + onChangeNBTABTextRemoveLinebreaks(base64ToArrayBuffer) + } + } + + return ( + + + + onChangeTestText(text)} + placeholder="please input test text" + placeholderTextColor={'#674651'} + value={testText} + /> + + + BtoA Encodes a character string into a Base64 character string. + + test string transform base64, testing the text: {testText} +