Clerk组件afterSignInUrl属性失效问题求助

在Next.js项目中使用Clerk的SignInButton组件，设置了afterSignInUrl="/learn"和afterSignUpUrl="/learn"属性，但登录/注册完成后并未跳转到/learn页面，而是重定向回主页。认证流程正常，其他功能无异常。

相关代码：

import Image from "next/image";
import { Loader } from "lucide-react";
import {
  ClerkLoaded,
  ClerkLoading,
  SignedIn,
  SignedOut,
  SignInButton,
  UserButton,
} from "@clerk/nextjs";
import { Button } from "@/components/ui/button";

export const Header = () => {
  return (
    <header className="h-20 w-full border-b-2 
    border-slate-200 px-4">
      <div className="lg:max-w-screen-lg mx-auto flex items-center
      justify-between h-full">
        <div className="pt-8 pl-4 pb-7 flex items-center gap-x-3">
          <Image src="/mascot.svg" height={40} width={40} alt="Mascot" />
          <h1 className="text-2xl font-extrabold text-green-600 tracking-wide">
            Lingo
          </h1>
        </div>
        <ClerkLoading>
          <Loader className="h-5 w-5 text-muted-foreground animate-spin" />
        </ClerkLoading>
        <ClerkLoaded>
          <SignedIn>
            <UserButton
          afterSignOutUrl="/"
            />
          </SignedIn>
          <SignedOut>
            <SignInButton mode="modal"
            afterSignInUrl="/learn"
            afterSignUpUrl="/learn"
            >
            <Button size="lg" variant="ghost">
              Login
            </Button>
            </SignInButton>
          </SignedOut>
        </ClerkLoaded>
      </div>
    </header>
  );
};

• 检查Clerk后台默认重定向配置
  登录Clerk控制台，进入对应应用，找到Authentication > Routes选项，查看Post-sign-in URL和Post-sign-up URL的设置。如果这两个值设为了主页（/），会覆盖组件上的属性配置。将其修改为/learn或留空，让组件属性生效。

• 确认Clerk包版本与属性匹配
  运行npm list @clerk/nextjs查看包版本，旧版本Clerk可能使用redirectUrl而非afterSignInUrl作为重定向属性。如果版本较低，尝试替换属性：

  <SignInButton mode="modal"
    redirectUrl="/learn"
  >
  

• 排查中间件强制重定向逻辑
  如果项目中使用了Clerk的middleware.ts，检查是否存在强制跳转到主页的规则。调整中间件配置，允许/learn作为登录后的目标页面。

• 清除缓存与会话
  清除浏览器缓存，或在Clerk控制台手动注销用户会话，排除旧缓存导致的重定向异常。

内容的提问来源于stack exchange，提问作者Fabio Marinho