refactor: Enhance OAuth authorization flow with improved parameter handling and loading state

This commit is contained in:
wood chen 2025-02-21 18:23:47 +08:00
parent 05b8ee3c75
commit 86adf32db8
2 changed files with 54 additions and 14 deletions

View File

@ -17,9 +17,28 @@ export async function signIn(data: Record<string, any>) {
if (oauthParams) { if (oauthParams) {
// 清除 cookie // 清除 cookie
cookieStore.delete("oauth_params"); cookieStore.set("oauth_params", "", { maxAge: 0 });
// 重定向到授权页面,带上 OAuth 参数
redirect(`/oauth/authorize?${oauthParams.value}`); // 解析原始的 OAuth 参数
const params = new URLSearchParams(oauthParams.value);
const clientId = params.get("client_id");
const redirectUri = params.get("redirect_uri");
const state = params.get("state");
const scope = params.get("scope") || "read_profile";
// 重新构建授权页面 URL
const authParams = new URLSearchParams({
response_type: "code",
client_id: clientId || "",
redirect_uri: redirectUri || "",
scope,
});
if (state) {
authParams.set("state", state);
}
// 重定向到授权页面
redirect(`/oauth/authorize?${authParams.toString()}`);
} }
// 如果没有 OAuth 参数,重定向到仪表板 // 如果没有 OAuth 参数,重定向到仪表板

View File

@ -24,16 +24,18 @@ export function UserAuthorize({
if (isLoading) { if (isLoading) {
return; return;
} }
setIsLoading(true);
try { // 检查是否是 SSO 回调
// 从 URL 中获取 sso 和 sig 参数
const sso = searchParams?.get("sso"); const sso = searchParams?.get("sso");
const sig = searchParams?.get("sig"); const sig = searchParams?.get("sig");
// 如果没有 SSO 参数,说明这是 OAuth 授权页面,不需要处理
if (!sso || !sig) { if (!sso || !sig) {
throw new Error("缺少必要的认证参数"); return;
} }
setIsLoading(true);
try {
// 传递 SSO 参数 // 传递 SSO 参数
await signIn({ await signIn({
sso, sso,
@ -42,10 +44,10 @@ export function UserAuthorize({
// 登录成功后刷新路由状态 // 登录成功后刷新路由状态
router.refresh(); router.refresh();
setIsLoading(false);
} catch (error) { } catch (error) {
console.error("登录过程出错:", error); console.error("登录过程出错:", error);
setError(error); setError(error);
} finally {
setIsLoading(false); setIsLoading(false);
} }
}, [isLoading, router, searchParams]); }, [isLoading, router, searchParams]);
@ -54,6 +56,25 @@ export function UserAuthorize({
signInCallback(); signInCallback();
}, [signInCallback]); }, [signInCallback]);
// 如果没有 SSO 参数,显示正在处理授权的界面
if (!searchParams?.get("sso")) {
return (
<Card className="w-full">
<CardHeader className="space-y-4 text-center">
<div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-blue-100">
<div className="h-8 w-8 animate-spin rounded-full border-4 border-blue-600 border-t-transparent"></div>
</div>
<CardTitle className="text-2xl font-semibold"></CardTitle>
</CardHeader>
<CardContent>
<p className="text-center text-gray-500">
</p>
</CardContent>
</Card>
);
}
if (error) { if (error) {
return ( return (
<Card className="w-full"> <Card className="w-full">
@ -82,11 +103,11 @@ export function UserAuthorize({
<div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-blue-100"> <div className="mx-auto flex h-16 w-16 items-center justify-center rounded-full bg-blue-100">
<div className="h-8 w-8 animate-spin rounded-full border-4 border-blue-600 border-t-transparent"></div> <div className="h-8 w-8 animate-spin rounded-full border-4 border-blue-600 border-t-transparent"></div>
</div> </div>
<CardTitle className="text-2xl font-semibold"></CardTitle> <CardTitle className="text-2xl font-semibold"></CardTitle>
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<p className="text-center text-gray-500"> <p className="text-center text-gray-500">
{isLoading ? "请稍候,我们正在处理您的授权请求" : "正在跳转..."} {isLoading ? "请稍候,我们正在处理您的登录请求" : "正在跳转..."}
</p> </p>
</CardContent> </CardContent>
</Card> </Card>