老师，我登录后刷新页面登录的状态无法保存?
来源：7-1 根据登录权限决定页面展示（1）
慕斯卡7039390
2021-06-11 09:13:33
import React,{Component} from 'react';
import {Button,Modal,Input,message} from 'antd';
import axios from 'axios';
import './style.css';
class Login extends Component{
constructor(props){
super(props);
this.showModal=this.showModal.bind(this);
this.hideModal=this.hideModal.bind(this);
this.changeUser=this.changeUser.bind(this);
this.checkLogin=this.checkLogin.bind(this);
this.changePassword=this.changePassword.bind(this);
this.logout=this.logout.bind(this);
this.state={
login:false,
modal:false,
user:'',
password:''
}
}
showModal(){
this.setState({
modal:true
});
}
hideModal(){
this.setState({
modal:false
});
}
changeUser(e){
this.setState({
user:e.target.value
});
}
changePassword(e){
this.setState({
password:e.target.value
})
}
logout(){
axios.get('http://www.dell-lee.com/react/api/logout.json',{
withCredentials:true
}).then(res=>{
const data=res.data.data;
if(data.logout){
this.setState({
login:false
})
}
});
}
checkLogin(){
const {user,password}=this.state;
const url=`http://www.dell-lee.com/react/api/login.json?user=${user}&password=${password}`;
axios.get(url,{
withCredentials: true
})
.then(res=>{
const login=res.data.data.login;
if(login){
message.success('登录成功');
this.setState({
login:res.data.data.login,
modal:false
})
}else{
message.error('登录失败');
}
});
}
render(){
const {login,modal}=this.state;
return (
<div className="login">
{
login?
<Button type="primary" onClick={this.logout}>退出</Button>:
<Button type="primary" onClick={this.showModal}>登录</Button>
}
<Modal
title="登录"
visible={modal}
onOk={this.checkLogin}
onCancel={this.hideModal}>
<Input onChange={this.changeUser} value={this.state.user} placeholder='请输入用户名' style={{marginBottom:10}}/>
<Input onChange={this.changePassword} value={this.state.password} placeholder='请输入密码' type='password'/>
</Modal>
</div>
)
}
componentDidMount(){
axios.get('http://www.dell-lee.com/react/api/isLogin.json', {
withCredentials: true
})
.then(res=>{
const login=res.data.data.login;
this.setState({
login
});
});
}
}
export default Login;
chrome://flags/ 也改了，还是不行？
1回答
-
好帮手慕慕子
2021-06-11
同学你好，在源码中测试同学粘贴的代码，效果没有问题，代码书写是正确的。
出现刷新后登录状态无法保存的问题是Chrome浏览器自身的问题。建议：
1、换个浏览器测试下。例如：火狐
2、确认SameSite已经修改为disable了。打开谷歌浏览器，地址栏输入chrome://flags/ ，然后再弹出的页面中输入SameSite，把第一个改为disable，重启浏览器，再测试就可以了
祝学习愉快~
0
相似问题