我目前正在尝试使用 Vue 和 Laravel 创建一个简单的 SPA。我已经有了工作的基础——用户可以注册和登录。
我只是不知道如何创建注销功能。
这就是我目前拥有的:
AuthController.php
:
public function logout()
{
$accessToken = auth()->user()->token();
$refreshToken = DB::table('oauth_refresh_tokens')
->where('access_token_id', $accessToken->id)
->update([
'revoked' => true
]);
$accessToken->revoke();
return response()->json(['status' => 200]);
}
routes/api.php
:
Route::middleware('auth:api')->group(function () {
Route::post('/logout', 'API\AuthController@logout');
Route::get('/get-user', 'API\AuthController@getUser');
});
现在,这就是我试图做的:
Layout.vue
:
methods: {
logout() {
axios.post('/api/logout').then(response => {
this.$router.push("/login")
}).catch(error => {
location.reload();
});
}
}
在 Auth.js
中调用我的注销功能:
logout() {
localStorage.removeItem('token')
localStorage.removeItem('expiration')
}
然而,当用户点击注销功能时,他们并没有立即注销(重定向到登录页面)——他们仍然可以浏览“仅限用户的页面”。
在正确注销之前,我必须刷新页面。
任何人都可以帮助我吗?这甚至是“安全”注销功能的正确方法吗?
原文由 oliverbj 发布,翻译遵循 CC BY-SA 4.0 许可协议
我自己从未使用过 Laravel,但您应该能够处理注销客户端,而无需在后端执行任何操作。目前您从本地存储中删除了身份验证令牌,因此用户无法访问需要您登录才能获取的数据。
您可能会调用您的
getUser
当您刷新页面时,这就是为什么您只是登出的原因 - 您将空令牌发送到后端服务器,它找不到与之关联的用户并返回一个空的/默认来宾对象。剩下要做的是在删除logout()
函数中的令牌后清除您的用户状态,或者向您的/get-user
端点发送请求。