使用AES加密存储在本地的密码

在控制台安装 npm install crypto-js 

在需要使用的页面进行引入 import CryptoJS from 'crypto-js'

$key = [Convert]::ToBase64String((1..32 | % {Get-Random -Maximum 256}))
$key
上述为随机生成秘钥的指令

附上一份 useAuth的登录对账户和密码的存储，不同角色登录，AES的加密和解密函数的使用

import CryptoJS from 'crypto-js'

import { ref } from 'vue'

import router from './index'

const isAuthenticated = ref(false)

const userRole = ref('')

//加密的秘钥,在powershell里面随机生成的

const secretKey = '/ZjSc7nqkLbWoeqBL/K4ytkUH4qvmlAsYxE02J1Uac='

export function useAuth() {

  const adminAccounts = [

    {

      username: 'admin@gmail.com',

      password: 'AdminPassword123!',

      role: 'Admin'

    },

    {

      username: 'admin1@gmail.com',

      password: 'AdminPassword123!',

      role: 'Admin'

    }

  ]

  // 加密并存储管理员账户信息到 localStorage

  const encryptedAdmins = adminAccounts.map((admin) => ({

    username: CryptoJS.AES.encrypt(admin.username, secretKey).toString(),

    password: CryptoJS.AES.encrypt(admin.password, secretKey).toString(),

    role: admin.role

  }))

  if (!localStorage.getItem('admins')) {

    localStorage.setItem('admins', JSON.stringify(encryptedAdmins))

  }

  // 添加管理员账户

  const addAdminAccount = (newAdmin) => {

    const existingAdmins = JSON.parse(localStorage.getItem('admins')) || []

    // 解密现有用户名用于比较

    const decryptedAdmins = existingAdmins.map((admin) => ({

      username: CryptoJS.AES.decrypt(admin.username, secretKey).toString(CryptoJS.enc.Utf8),

      password: admin.password,

      role: admin.role

    }))

    // 检查用户名是否已经存在

    const adminExists = decryptedAdmins.some((admin) => admin.username === newAdmin.username)

    if (adminExists) {

      throw new Error('Admin account already exists')

    }

    // 加密并添加新的管理员账户

    const encryptedAdmin = {

      username: CryptoJS.AES.encrypt(newAdmin.username, secretKey).toString(),

      password: CryptoJS.AES.encrypt(newAdmin.password, secretKey).toString(),

      role: newAdmin.role

    }

    existingAdmins.push(encryptedAdmin)

    localStorage.setItem('admins', JSON.stringify(existingAdmins))

  }

  const login = (username, password) => {

    const existingAdmins = JSON.parse(localStorage.getItem('admins')) || []

    // 解密管理员数据用于登录验证

    const decryptedAdmins = existingAdmins.map((admin) => {

      const decryptedUsername = CryptoJS.AES.decrypt(admin.username, secretKey).toString(

        CryptoJS.enc.Utf8

      )

      const decryptedPassword = CryptoJS.AES.decrypt(admin.password, secretKey).toString(

        CryptoJS.enc.Utf8

      )

      console.log(

        `Decrypted Username: ${decryptedUsername}, Decrypted Password: ${decryptedPassword}`

      ) // 调试输出

      return {

        username: decryptedUsername,

        password: decryptedPassword,

        role: admin.role

      }

    })

    const admin = decryptedAdmins.find(

      (admin) => admin.username === username && admin.password === password

    )

    if (admin) {

      isAuthenticated.value = true

      userRole.value = admin.role

      localStorage.setItem('loggedInUser', JSON.stringify(admin)) // 存储解密后的管理员数据用于会话

      router.push({ name: 'adminView' })

      return

    }

    // 检查用户身份

    const existingUsers = JSON.parse(localStorage.getItem('users')) || []

    const decryptedUsers = existingUsers.map((user) => {

      const decryptedUsername = CryptoJS.AES.decrypt(user.username, secretKey).toString(

        CryptoJS.enc.Utf8

      )

      const decryptedPassword = CryptoJS.AES.decrypt(user.password, secretKey).toString(

        CryptoJS.enc.Utf8

      )

      console.log(

        `Decrypted User Username: ${decryptedUsername}, Decrypted User Password: ${decryptedPassword}`

      ) // 调试输出

      return {

        username: decryptedUsername,

        password: decryptedPassword

      }

    })

    const user = decryptedUsers.find(

      (user) => user.username === username && user.password === password

    )

    if (user) {

      isAuthenticated.value = true

      userRole.value = 'User'

      localStorage.setItem('loggedInUser', JSON.stringify(user))

      router.push({ name: 'home' })

      return

    }

    throw new Error('Invalid username or password')

  }

  const logout = () => {

    localStorage.removeItem('loggedInUser')

    isAuthenticated.value = false

    userRole.value = ''

    router.push({ name: 'home' })

  }

  return { isAuthenticated, userRole, login, logout, addAdminAccount }

}