目录
1.登录前先请求,获取一个token
2.使用登录token,通过CryptoJS给password加密
3.解密(后端完成即可)
4.登录
5.在请求拦截中设置,每次请求时带上token
6.后端拿到token
1.登录前先请求,获取一个token,也可以在本地写死
暂且叫登录token,用来给登录时密码的加密
async getToken(){
const {data:token} = await getToken()
// token : eaaaaaaaaaIUzI1NiJ9.eyJ1aWQiOiJDRTY3,例如这样的
this.token = token
}
2.使用登录token,通过CryptoJS给password加密
ps:当然要和后端商量好.? ?npm i crypto-js
// 记得导入
let CryptoJS = require('crypto-js');
// 规定截取登录token的多少位
let key = CryptoJS.enc.Utf8.parse(this.token.substr(0, 30));
// 拿到登录时输入的密码
let srcs = CryptoJS.enc.Utf8.parse(this.password);
// 加密方式
let encrypted = CryptoJS.AES.encrypt(srcs, key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
let data = {
name:this.name,
// 这样即可完成加密
password:encrypted.toString(),
token:this.token
}
// 请求登录即可
this.goLogin(data)
3.解密(后端完成即可)
ps: key和配置信息一定要沟通成完全一样,才能解密成功
// pwd 即为加密后的密码。 例如 5CSUSaG2vhvoITJESgTR6A==
let key = CryptoJS.enc.Utf8.parse(this.token.substr(0, 30));
let decrypted = CryptoJS.AES.decrypt(this.pwd, key, {
mode: CryptoJS.mode.ECB,
padding: CryptoJS.pad.Pkcs7
});
// 获得解密后的密码
let resPwd = decrypted.toString(CryptoJS.enc.Utf8)
4.登录
// 登录请求
async goLogin(data){
const {data:res} = await goLogin(data)
// 成功后,拿到用户token,把token写入session中
window.sessionStorage.setItem('token', res.token);
}
5.在请求拦截中设置,每次请求时带上token
ajax.interceptors.request.use(config => {
// headers加参数
let token = window.sessionStorage.getItem('token');
config.headers.common['x-access-token'] = token;
return config;
},(error) => {
console.log(erroe)
});
6.后端拿到token
解密token获得userId , 根据需要 返回前端需要的数据
用户下次再请求时 , 如果token还在有效期内,不需要重新登陆
|