Vue3 usa cifrado MD5 (claro y claro)

descripción general

Recientemente, quiero crear un proyecto en la nube. Encontré un proyecto de plantilla en gitee. El front-end usa vue3 + typeScript, Element Plus, Vue Router, Pinia, Axios, i18n, Vite y otras tecnologías. Recientemente usé el cifrado vue3 MD5. Por cierto, lo aprenderé .. Para resumir aquí, si hay deficiencias, espero que los grandes puedan señalarlas.

vue3 instalar ts-md5

Nota: ts-md5 no es js-md5

npm install --save ts-md5

parcial

definición:

import {
    
     Md5 } from 'ts-md5';

Uso topico:

// 定义MD5对象
const md5:any = new Md5()
md5.appendAsciiStr('密码')
const password = md5.end()
console.log('加密密码:',password);

el caso

// 表单提交
const submitHandle = () => {
    
    
	dataFormRef.value.validate((valid: boolean) => {
    
    
		if (!valid) {
    
    
			return false
		}
		// 定义MD5对象
		const md5:any = new Md5()
		md5.appendAsciiStr(dataForm.password)
		dataForm.password = md5.end()
		console.log('加密密码:',dataForm.password);
		useAccountScriptSubmitApi(dataForm).then(() => {
    
    
			ElMessage.success({
    
    
				message: '操作成功',
				duration: 500,
				onClose: () => {
    
    
					visible.value = false
					emit('refreshDataList')
				}
			})
		})
	})
}

vue3 instalar js-md5

npm install --save js-md5

parcial

definición:

import md5 from "js-md5";

aparece el problema

inserte la descripción de la imagen aquí
Significado:
se declaró "md5", pero nunca se leyó su valor. ts(6133)
No se pudo encontrar el archivo de declaración para el módulo 'js-md5'. ".../src/md5.js" implícitamente tiene el tipo "cualquiera".
Pruebe npm i --save-dev @types/js-md5 si existe, o agregue un nuevo archivo de declaración (.d.ts) ts que contenga el módulo de declaración 'js-md5' ;

Prompt ha proporcionado dos opciones.

Opción 1 (nunca usada)

 npm i --save-dev @types/js-md5

Opción II

Cree un archivo shims.d.ts en el directorio src. El nombre del archivo puede definirlo usted mismo . Como ya tengo un archivo shims.d.ts, agrego directamente una declaración en el archivo. El archivo .d.ts se puede colocar en el directorio src o en el directorio raíz.
inserte la descripción de la imagen aquí
inserte la descripción de la imagen aquí

el caso

Después de la configuración, puede usarlo.

// 表单提交
const submitHandle = () => {
    
    
	dataFormRef.value.validate((valid: boolean) => {
    
    
		if (!valid) {
    
    
			return false
		}
		dataForm.password = md5(dataForm.password)
		console.log('加密密码:',dataForm.password);
	})
}

lograr efecto

inserte la descripción de la imagen aquí
No es fácil de crear, espero que me puedan dar un like y apoyo, gracias

Supongo que te gusta

Origin blog.csdn.net/qq_44697754/article/details/129605910
Recomendado
Clasificación