vue中如何使用js-base64、和js-cookie安全的存储信息

在Vue中使用js-base64和js-cookie来安全存储登录用户信息，你可以按照以下步骤进行操作：

首先，安装js-base64和js-cookie库。你可以使用npm或者yarn命令来安装它们：

npm install js-base64 js-cookie

在你的Vue组件中引入这两个库：

import { Base64 } from 'js-base64';
import Cookies from 'js-cookie';

在登录成功后，将用户信息进行Base64编码，并使用Cookie存储：

// 假设用户信息是一个对象，包含username和token字段
const userInfo = {
  username: 'example',
  token: 'your_token_here'
};

// 将用户信息转换为JSON字符串，并进行Base64编码
const encodedUserInfo = Base64.encode(JSON.stringify(userInfo));

// 使用Cookie存储编码后的用户信息
Cookies.set('userInfo', encodedUserInfo);

 

在需要获取用户信息的地方，从Cookie中读取并解码用户信息：

// 从Cookie中获取编码后的用户信息
const encodedUserInfo = Cookies.get('userInfo');

if (encodedUserInfo) {
  // 解码Base64编码的用户信息
  const decodedUserInfo = JSON.parse(Base64.decode(encodedUserInfo));

  // 现在你可以使用解码后的用户信息进行相关操作
  console.log(decodedUserInfo.username);
  console.log(decodedUserInfo.token);
} else {
  // 用户信息不存在或已过期
  console.log('用户未登录');
}

 

        通过以上步骤，你可以在Vue中安全地使用js-base64和js-cookie来存储和获取登录用户信息。记得在适当的时候清除或更新用户信息，以保持数据的准确性和安全性。