Vue 单点登录
1.每次请求登录的时候携带tokenaxios.interceptors.request.use(function(config) {//获取令牌const token = sessionStorage.getItem(‘token’)if (token!=null) {config.headers.Authorization = 'bearer ' + token...
·
1.每次请求登录的时候携带token
axios.interceptors.request.use(
function(config) {
// 获取令牌
const token = sessionStorage.getItem('token')
if (token!=null) {
config.headers.Authorization = 'bearer ' + token
}
return config;
},
function(error) {
return Promise.reject(error)
}
)
2.下载并导入import Base64 from 'js-base64’
3.点击登录提交时
// 登录提交表单信息
submit_btn(formRef) {
this.$refs[formRef].validate(async (valid) => {
// 表单校验
if (!valid) return this.$message.error('请填写完整信息!')
const {
data: res
} = await this.$http.post('/authentication/form', {}, {
headers: {
"Authorization": "Basic " + Base64.encode('tin-portal:zlf78641d063850b469f1k201feff3c4'),
"Content-Type": "application/x-www-form-urlencoded"
},
params: {
username: this.loginForm.username,
password: this.loginForm.password,
imageCode: this.loginForm.picPass,
deviceId: this.text
}
})
// console.log(data)
console.log(res)
// 登录成功
if (res.status == 200) {
this.$message.success('登录成功!')
// 清空表单
this.loginForm.username = '',
this.loginForm.password = '',
this.loginForm.picPass = ''
// 把 登录成功后,服务器颁发的令牌,存储到 sessionStorage 中
sessionStorage.setItem('token', res.data.access_token)
sessionStorage.setItem('refresh_token', res.data.refresh_token)
// 通过 编程式导航 API,跳转到 后台 首页的 路由地址 /home
if(this.$route.query.userId){
this.$router.push(this.$route.query.userId)
}else{
this.$router.push('/')
}
}else if(res.status == 20011) {
this.$message.error('图片验证码输入错误')
this.loginForm.picPass = ''
this.getPicAuthCode()
}else if(res.status == 20007) {
this.$message.error('密码输入错误')
this.loginForm.password = ''
this.loginForm.picPass = ''
this.getPicAuthCode()
}
})
},
更多推荐
已为社区贡献3条内容
所有评论(0)