Skip to content

Commit 2816ed2

Browse files
sharevbsharevb
committed
feat(Hash Text): more hashing methods
Added ADLER32, BLAKE2B, BLAKE2S, BLAKE3, CRC32, CRC32C, KECCAK, PBKDF2, SM3, WHIRLPOOL, XXHASH128, XXHASH3, XXHASH32, XXHASH64, Argon2, Argon2i, Argon2d, Argon2id Fix CorentinTh#728 and CorentinTh#641 and CorentinTh#362
1 parent d3b32cc commit 2816ed2

File tree

5 files changed

+225
-11
lines changed

5 files changed

+225
-11
lines changed

‎package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@
6161
"figlet": "^1.7.0",
6262
"figue": "^1.2.0",
6363
"fuse.js": "^6.6.2",
64+
"hash-wasm": "^4.11.0",
6465
"highlight.js": "^11.7.0",
6566
"iarna-toml-esm": "^3.0.5",
6667
"ibantools": "^4.3.3",

‎pnpm-lock.yaml

Lines changed: 13 additions & 6 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/composable/queryParams.ts

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import { useRouteQuery } from '@vueuse/router';
22
import { computed } from 'vue';
3+
import { useStorage } from '@vueuse/core';
34

4-
export { useQueryParam };
5+
export { useQueryParam, useQueryParamOrStorage };
56

67
const transformers = {
78
number: {
@@ -33,3 +34,31 @@ function useQueryParam<T>({ name, defaultValue }: { name: string; defaultValue:
3334
},
3435
});
3536
}
37+
38+
function useQueryParamOrStorage<T>({ name, storageName, defaultValue }: { name: string; storageName: string; defaultValue?: T }) {
39+
const type = typeof defaultValue;
40+
const transformer = transformers[type as keyof typeof transformers] ?? transformers.string;
41+
42+
const storageRef = useStorage(storageName, defaultValue);
43+
const storageDefaultValue = storageRef.value ?? defaultValue;
44+
45+
const proxy = useRouteQuery(name, transformer.toQuery(storageDefaultValue as never));
46+
47+
const ref = computed<T>({
48+
get() {
49+
return transformer.fromQuery(proxy.value) as unknown as T;
50+
},
51+
set(value) {
52+
proxy.value = transformer.toQuery(value as never);
53+
},
54+
});
55+
56+
watch(
57+
ref,
58+
(newValue) => {
59+
storageRef.value = newValue;
60+
},
61+
);
62+
63+
return ref;
64+
}

‎src/tools/hash-text/hash-text.vue

Lines changed: 161 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,30 @@
22
import type { lib } from 'crypto-js';
33
import { MD5, RIPEMD160, SHA1, SHA224, SHA256, SHA3, SHA384, SHA512, enc } from 'crypto-js';
44
5+
import {
6+
adler32,
7+
argon2d,
8+
argon2i,
9+
argon2id,
10+
blake2b,
11+
blake2s,
12+
blake3,
13+
crc32,
14+
crc32c,
15+
createSHA256,
16+
keccak,
17+
pbkdf2,
18+
sm3,
19+
whirlpool,
20+
xxhash128,
21+
xxhash3,
22+
xxhash32,
23+
xxhash64,
24+
} from 'hash-wasm';
25+
526
import InputCopyable from '../../components/InputCopyable.vue';
627
import { convertHexToBin } from './hash-text.service';
7-
import { useQueryParam } from '@/composable/queryParams';
28+
import { useQueryParamOrStorage } from '@/composable/queryParams';
829
930
const algos = {
1031
MD5,
@@ -20,7 +41,27 @@ const algos = {
2041
type AlgoNames = keyof typeof algos;
2142
type Encoding = keyof typeof enc | 'Bin';
2243
const algoNames = Object.keys(algos) as AlgoNames[];
23-
const encoding = useQueryParam<Encoding>({ defaultValue: 'Hex', name: 'encoding' });
44+
45+
const algosWasm = {
46+
adler32,
47+
crc32,
48+
crc32c,
49+
blake2b,
50+
blake2s,
51+
blake3,
52+
keccak,
53+
xxhash32,
54+
xxhash64,
55+
xxhash3,
56+
xxhash128,
57+
sm3,
58+
whirlpool,
59+
} as const;
60+
61+
type AlgoWasmNames = keyof typeof algosWasm;
62+
const algoWasmNames = Object.keys(algosWasm) as AlgoWasmNames[];
63+
64+
const encoding = useQueryParamOrStorage<Encoding>({ defaultValue: 'Hex', storageName: 'hash-text:encoding', name: 'encoding' });
2465
const clearText = ref('');
2566
2667
function formatWithEncoding(words: lib.WordArray, encoding: Encoding) {
@@ -32,12 +73,91 @@ function formatWithEncoding(words: lib.WordArray, encoding: Encoding) {
3273
}
3374
3475
const hashText = (algo: AlgoNames, value: string) => formatWithEncoding(algos[algo](value), encoding.value);
76+
77+
const defaultHashWasmValues = {
78+
adler32: '',
79+
crc32: '',
80+
crc32c: '',
81+
blake2b: '',
82+
blake2s: '',
83+
blake3: '',
84+
keccak: '',
85+
xxhash32: '',
86+
xxhash64: '',
87+
xxhash3: '',
88+
xxhash128: '',
89+
sm3: '',
90+
whirlpool: '',
91+
};
92+
const hashWasmValues = computedAsync(async () => {
93+
const encodingValue = encoding.value;
94+
const clearTextValue = clearText.value;
95+
const ret = defaultHashWasmValues;
96+
for (const algo of algoWasmNames) {
97+
ret[algo] = formatWithEncoding(enc.Hex.parse(await algosWasm[algo](clearTextValue)), encodingValue);
98+
}
99+
return ret;
100+
}, defaultHashWasmValues);
101+
102+
const salt = new Uint8Array(16);
103+
window.crypto.getRandomValues(salt);
104+
const hashWasmArgon2i = computedAsync(async () => {
105+
const clearTextValue = clearText.value;
106+
return await argon2i({
107+
password: clearTextValue,
108+
salt,
109+
parallelism: 1,
110+
memorySize: 128,
111+
iterations: 4,
112+
hashLength: 16,
113+
outputType: 'encoded',
114+
});
115+
});
116+
const hashWasmArgon2d = computedAsync(async () => {
117+
const clearTextValue = clearText.value;
118+
return await argon2d({
119+
password: clearTextValue,
120+
salt,
121+
parallelism: 1,
122+
memorySize: 128,
123+
iterations: 4,
124+
hashLength: 16,
125+
outputType: 'encoded',
126+
});
127+
});
128+
const hashWasmArgon2id = computedAsync(async () => {
129+
const clearTextValue = clearText.value;
130+
return await argon2id({
131+
password: clearTextValue,
132+
salt,
133+
parallelism: 1,
134+
memorySize: 128,
135+
iterations: 4,
136+
hashLength: 16,
137+
outputType: 'encoded',
138+
});
139+
});
140+
const hashWasmPBKDF2 = computedAsync(async () => {
141+
const clearTextValue = clearText.value;
142+
return await pbkdf2({
143+
password: clearTextValue,
144+
salt,
145+
iterations: 16,
146+
hashLength: 32,
147+
hashFunction: createSHA256(),
148+
});
149+
});
35150
</script>
36151

37152
<template>
38153
<div>
39154
<c-card>
40-
<c-input-text v-model:value="clearText" multiline raw-text placeholder="Your string to hash..." rows="3" autosize autofocus label="Your text to hash:" />
155+
<c-input-text
156+
v-model:value="clearText"
157+
multiline raw-text
158+
placeholder="Your string to hash..." rows="3"
159+
autosize autofocus label="Your text to hash:"
160+
/>
41161

42162
<n-divider />
43163

@@ -73,6 +193,44 @@ const hashText = (algo: AlgoNames, value: string) => formatWithEncoding(algos[al
73193
<InputCopyable :value="hashText(algo, clearText)" readonly />
74194
</n-input-group>
75195
</div>
196+
197+
<div v-for="algo in algoWasmNames" :key="algo" style="margin: 5px 0">
198+
<n-input-group>
199+
<n-input-group-label style="flex: 0 0 120px">
200+
{{ algo.toUpperCase() }}
201+
</n-input-group-label>
202+
<InputCopyable :value="hashWasmValues[algo]" readonly />
203+
</n-input-group>
204+
</div>
205+
206+
<n-divider />
207+
208+
<div style="margin: 5px 0">
209+
<n-input-group>
210+
<n-input-group-label style="flex: 0 0 120px">
211+
Argon2d
212+
</n-input-group-label>
213+
<InputCopyable :value="hashWasmArgon2d" readonly />
214+
</n-input-group>
215+
<n-input-group>
216+
<n-input-group-label style="flex: 0 0 120px">
217+
Argon2i
218+
</n-input-group-label>
219+
<InputCopyable :value="hashWasmArgon2i" readonly />
220+
</n-input-group>
221+
<n-input-group>
222+
<n-input-group-label style="flex: 0 0 120px">
223+
Argon2id
224+
</n-input-group-label>
225+
<InputCopyable :value="hashWasmArgon2id" readonly />
226+
</n-input-group>
227+
<n-input-group>
228+
<n-input-group-label style="flex: 0 0 120px">
229+
PBKDF2
230+
</n-input-group-label>
231+
<InputCopyable :value="hashWasmPBKDF2" readonly />
232+
</n-input-group>
233+
</div>
76234
</c-card>
77235
</div>
78236
</template>

‎src/tools/hash-text/index.ts

Lines changed: 20 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@ import { translate } from '@/plugins/i18n.plugin';
55
export const tool = defineTool({
66
name: translate('tools.hash-text.title'),
77
path: '/hash-text',
8-
description: translate('tools.hash-text.description'),
8+
description:
9+
'Hash a text string using the function you need : MD5, SHA1, SHA256, SHA224, SHA512, SHA384, SHA3, RIPEMD160, ADLER32, CRC32, CRC32C, BLAKE, KECCAK, XXHASH, SM3, WHIRLPOOL or Argon2(i/d/id)',
910
keywords: [
1011
'hash',
1112
'digest',
@@ -20,6 +21,24 @@ export const tool = defineTool({
2021
'SHA384',
2122
'SHA3',
2223
'RIPEMD160',
24+
'ADLER32',
25+
'BLAKE2B',
26+
'BLAKE2S',
27+
'BLAKE3',
28+
'CRC32',
29+
'CRC32C',
30+
'KECCAK',
31+
'PBKDF2',
32+
'SM3',
33+
'WHIRLPOOL',
34+
'XXHASH128',
35+
'XXHASH3',
36+
'XXHASH32',
37+
'XXHASH64',
38+
'Argon2',
39+
'Argon2i',
40+
'Argon2d',
41+
'Argon2id',
2342
],
2443
component: () => import('./hash-text.vue'),
2544
icon: EyeOff,

0 commit comments

Comments
 (0)