feat(new-tool): bcrypt
This commit is contained in:
Corentin Thomasset
parent
2b89111cbb
commit
6d5856fa93
24
package-lock.json
generated
24
package-lock.json
generated
@ -13,6 +13,7 @@
|
||||
"@vicons/tabler": "^0.12.0",
|
||||
"@vueuse/core": "^8.2.1",
|
||||
"@vueuse/head": "^0.7.5",
|
||||
"bcryptjs": "^2.4.3",
|
||||
"change-case": "^4.1.2",
|
||||
"colord": "^2.9.2",
|
||||
"cron-validator": "^1.3.1",
|
||||
@ -31,6 +32,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rushstack/eslint-patch": "^1.1.0",
|
||||
"@types/bcryptjs": "^2.4.2",
|
||||
"@types/crypto-js": "^4.1.1",
|
||||
"@types/jsdom": "^16.2.14",
|
||||
"@types/node": "^16.11.25",
|
||||
@ -2112,6 +2114,12 @@
|
||||
"node": ">=10.13.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/bcryptjs": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/bcryptjs/-/bcryptjs-2.4.2.tgz",
|
||||
"integrity": "sha512-LiMQ6EOPob/4yUL66SZzu6Yh77cbzJFYll+ZfaPiPPFswtIlA/Fs1MzdKYA7JApHU49zQTbJGX3PDmCpIdDBRQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/@types/chai": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.0.tgz",
|
||||
@ -3173,6 +3181,11 @@
|
||||
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/bcryptjs": {
|
||||
"version": "2.4.3",
|
||||
"resolved": "https://registry.npmjs.org/bcryptjs/-/bcryptjs-2.4.3.tgz",
|
||||
"integrity": "sha1-mrVie5PmBiH/fNrF2pczAn3x0Ms="
|
||||
},
|
||||
"node_modules/bluebird": {
|
||||
"version": "3.7.2",
|
||||
"resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
|
||||
@ -12690,6 +12703,12 @@
|
||||
"integrity": "sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/bcryptjs": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/@types/bcryptjs/-/bcryptjs-2.4.2.tgz",
|
||||
"integrity": "sha512-LiMQ6EOPob/4yUL66SZzu6Yh77cbzJFYll+ZfaPiPPFswtIlA/Fs1MzdKYA7JApHU49zQTbJGX3PDmCpIdDBRQ==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/chai": {
|
||||
"version": "4.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/chai/-/chai-4.3.0.tgz",
|
||||
@ -13526,6 +13545,11 @@
|
||||
"integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
|
||||
"dev": true
|
||||
},
|
||||
"bcryptjs": {
|
||||
"version": "2.4.3",
|
||||
"resolved": "https://registry.npmjs.org/bcryptjs/-/bcryptjs-2.4.3.tgz",
|
||||
"integrity": "sha1-mrVie5PmBiH/fNrF2pczAn3x0Ms="
|
||||
},
|
||||
"bluebird": {
|
||||
"version": "3.7.2",
|
||||
"resolved": "https://registry.npmjs.org/bluebird/-/bluebird-3.7.2.tgz",
|
||||
|
||||
@ -18,6 +18,7 @@
|
||||
"@vicons/tabler": "^0.12.0",
|
||||
"@vueuse/core": "^8.2.1",
|
||||
"@vueuse/head": "^0.7.5",
|
||||
"bcryptjs": "^2.4.3",
|
||||
"change-case": "^4.1.2",
|
||||
"colord": "^2.9.2",
|
||||
"cron-validator": "^1.3.1",
|
||||
@ -36,6 +37,7 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@rushstack/eslint-patch": "^1.1.0",
|
||||
"@types/bcryptjs": "^2.4.2",
|
||||
"@types/crypto-js": "^4.1.1",
|
||||
"@types/jsdom": "^16.2.14",
|
||||
"@types/node": "^16.11.25",
|
||||
|
||||
118
src/tools/bcrypt/bcrypt.vue
Normal file
118
src/tools/bcrypt/bcrypt.vue
Normal file
@ -0,0 +1,118 @@
|
||||
<template>
|
||||
<n-card title="Hash">
|
||||
<n-form label-width="120">
|
||||
<n-form-item
|
||||
label="Your string: "
|
||||
label-placement="left"
|
||||
>
|
||||
<n-input
|
||||
v-model:value="input"
|
||||
placeholder="Your string to bcrypt..."
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
autocapitalize="off"
|
||||
spellcheck="false"
|
||||
/>
|
||||
</n-form-item>
|
||||
<n-form-item
|
||||
label="Salt count: "
|
||||
label-placement="left"
|
||||
>
|
||||
<n-input-number
|
||||
v-model:value="saltCount"
|
||||
placeholder="Salt rounds..."
|
||||
:max="10"
|
||||
:min="0"
|
||||
style="width: 100%;"
|
||||
/>
|
||||
</n-form-item>
|
||||
<n-input
|
||||
:value="hashed"
|
||||
readonly
|
||||
style="text-align: center;"
|
||||
/>
|
||||
</n-form>
|
||||
<br>
|
||||
<n-space justify="center">
|
||||
<n-button
|
||||
secondary
|
||||
@click="copy"
|
||||
>
|
||||
Copy hash
|
||||
</n-button>
|
||||
</n-space>
|
||||
</n-card>
|
||||
|
||||
<br>
|
||||
<n-card title="Compare string with hash">
|
||||
<n-form label-width="120">
|
||||
<n-form-item
|
||||
label="Your string: "
|
||||
label-placement="left"
|
||||
>
|
||||
<n-input
|
||||
v-model:value="compareString"
|
||||
placeholder="Your string to compare..."
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
autocapitalize="off"
|
||||
spellcheck="false"
|
||||
/>
|
||||
</n-form-item>
|
||||
<n-form-item
|
||||
label="Your hash: "
|
||||
label-placement="left"
|
||||
>
|
||||
<n-input
|
||||
v-model:value="compareHash"
|
||||
placeholder="Your hahs to compare..."
|
||||
autocomplete="off"
|
||||
autocorrect="off"
|
||||
autocapitalize="off"
|
||||
spellcheck="false"
|
||||
/>
|
||||
</n-form-item>
|
||||
<n-form-item
|
||||
label="Do they match ? "
|
||||
label-placement="left"
|
||||
:show-feedback="false"
|
||||
>
|
||||
<div
|
||||
class="compare-result"
|
||||
:class="{positive:compareMatch}"
|
||||
>
|
||||
{{ compareMatch ? 'Yes' : 'No' }}
|
||||
</div>
|
||||
</n-form-item>
|
||||
</n-form>
|
||||
</n-card>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue';
|
||||
import {hashSync, compareSync} from 'bcryptjs'
|
||||
import { useCopy } from '@/composable/copy';
|
||||
import { useThemeVars } from 'naive-ui';
|
||||
|
||||
const themeVars = useThemeVars()
|
||||
|
||||
const input = ref('')
|
||||
const saltCount = ref(10)
|
||||
const hashed = computed(() => hashSync(input.value, saltCount.value))
|
||||
const {copy} = useCopy({source: hashed, text:'Hashed string copied to the clipboard'})
|
||||
|
||||
const compareString = ref('')
|
||||
const compareHash = ref('')
|
||||
const compareMatch = computed(() => compareSync(compareString.value, compareHash.value))
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.compare-result {
|
||||
color: v-bind('themeVars.errorColor');
|
||||
|
||||
&.positive {
|
||||
color: v-bind('themeVars.successColor')
|
||||
}
|
||||
}
|
||||
</style>
|
||||
11
src/tools/bcrypt/index.ts
Normal file
11
src/tools/bcrypt/index.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import { LockSquare } from '@vicons/tabler';
|
||||
import type { ITool } from './../Tool';
|
||||
|
||||
export const tool: ITool = {
|
||||
name: 'Bcrypt',
|
||||
path: '/bcrypt',
|
||||
description: 'Hash and compare text string using bcrypt. Bcrypt is a password-hashing function based on the Blowfish cipher.',
|
||||
keywords: ['bcrypt', 'hash', 'compare', 'password', 'salt', 'round', 'storage', 'crypto'],
|
||||
component: () => import('./bcrypt.vue'),
|
||||
icon: LockSquare,
|
||||
};
|
||||
@ -1,6 +1,7 @@
|
||||
import { LockOpen } from '@vicons/tabler';
|
||||
import type { ToolCategory } from './Tool';
|
||||
|
||||
import { tool as bcrypt } from './bcrypt';
|
||||
import { tool as caseConverter } from './case-converter';
|
||||
import { tool as colorConverter } from './color-converter';
|
||||
import { tool as qrCodeGenerator } from './qr-code-generator';
|
||||
@ -24,7 +25,7 @@ export const toolsByCategory: ToolCategory[] = [
|
||||
{
|
||||
name: 'Crypto',
|
||||
icon: LockOpen,
|
||||
components: [tokenGenerator, hashText, uuidGenerator, cypher, bip39],
|
||||
components: [tokenGenerator, hashText, bcrypt, uuidGenerator, cypher, bip39],
|
||||
},
|
||||
{
|
||||
name: 'Converter',
|
||||
|
||||
Loading…
Reference in New Issue
Block a user