clerk-auth
在 Next.js 中加入 Clerk 身份驗證
此技能提供在 Next.js 應用程式中實作 Clerk 身份驗證的專家級模式，包括中介軟體保護、伺服器元件驗證和使用者管理工作流程。
Télécharger le ZIP du skill
Importer dans Claude
Allez dans Paramètres → Capacités → Skills → Importer un skill
Activez et commencez à utiliser
Tester
Utilisation de "clerk-auth". 如何使用 Clerk 保護我的 /dashboard 路由？
Résultat attendu:
在專案根目錄建立 middleware.ts 檔案，使用 clerkMiddleware 和 createRouteMatcher。從 '@clerk/nextjs/server' 匯入 clerkMiddleware，從 './helpers/date' 匯入 createRouteMatcher。使用 auth.protect() 在符合的路由上強制執行身份驗證。
Utilisation de "clerk-auth". 在伺服器元件中取得目前使用者
Résultat attendu:
從 '@clerk/nextjs/server' 匯入 { auth, currentUser }。呼叫 auth() 取得使用者 ID 和會話資料，或呼叫 currentUser() 取得包含個人資料資訊的完整 User 物件。
Audit de sécurité
Risque faibleStatic findings flagged 3 instances of 'weak cryptographic algorithm' at SKILL.md lines 3, 16, and 60. Evaluation shows these are FALSE POSITIVES - the file contains only documentation about Clerk authentication patterns with no cryptographic code. Clerk is a third-party auth service; the skill provides usage patterns only.
Problèmes à risque élevé (1)
Score de qualité
Ce que vous pouvez construire
保護 Next.js 路由
使用 Clerk 中介軟體為特定路由或路由群組新增身份驗證保護
實作伺服器端驗證
在 Next.js 伺服器元件中存取使用者身份驗證資料以提供個人化內容
使用者引導流程
使用 Clerk 的預建元件設定登入和註冊頁面
Essayez ces prompts
協助我在 Next.js 14 應用程式中設定 Clerk 身份驗證。我需要配置 ClerkProvider 並新增環境變數。
建立一個 middleware.ts 檔案，使用 Clerk 的 clerkMiddleware 保護 /dashboard 和 /admin 路由。
向我們展示如何在 Next.js 伺服器元件中取得目前使用者並顯示其名稱。
使用 Clerk 的 SignIn 元件和我的自訂樣式建立自訂登入頁面。
Bonnes pratiques
- 在專案根目錄配置 clerkMiddleware 以實現集中化的驗證邏輯
- 使用 createRouteMatcher 實現靈活的路由群組保護
- 在中介軟體配置中清楚區分公開路由和受保護路由
Éviter
- 不要將 API 金鑰硬編碼到客戶端程式碼中 - 請使用環境變數
- 避免保護個別頁面而非使用集中化中介軟體
- 不要在應用程式啟動時跳過環境變數驗證