在 NestJS 伺服器應用程式中使用 Clerk 進行身份驗證
介紹
本文提供了使用 Clerk 在 NestJS 後端應用程式中實現身份驗證和授權的全面逐步指南。
什麼是文員?
Clerk 是一個綜合平台,提供可嵌入的使用者介面、靈活的 API 以及用於無縫用戶身份驗證和管理的直覺且強大的儀表板。它涵蓋了從會話管理和多因素身份驗證到社交登入、魔術連結、電子郵件或簡訊一次性密碼等的一切。
為什麼要使用文員?
身份驗證和安全要求、趨勢和最佳實踐總是在不斷發展,因為資料保護和隱私變得越來越重要。透過將這些責任轉移給專業服務供應商,您可以專注於建立應用程式的核心功能並更快地交付。
像 Clerk 這樣的平台可以為您承擔這些安全任務。
先決條件
- Typescript 基礎知識
- 熟悉 NestJS 基礎
- 了解後端驗證概念
- 執行 Node 18 或最新版本
項目設定
該專案需要一個新的或現有的 NestJS 專案、一個 Clerk 帳戶和應用程序,以及 Passport、Passport Strategy 和 Clerk 後端 SDK 等庫。
建立 NestJS 項目
您可以使用 Nest CLI 輕鬆設定新的 NestJS 專案。使用您喜歡的任何套件管理器,執行以下命令來建立新的 Nest 應用程式:
$ pnpm add -g @nestjs/cli $ nest new clerk-auth
查看 NestJS 文件以了解更多詳細資訊。
設定您的文員帳戶和應用程式
如果您還沒有 Clerk 帳戶,請建立一個 Clerk 帳戶並在 Clerk 儀表板中設定一個新應用程式。您可以在 Clerk 網站上開始使用。
安裝所需的庫
可以使用以下指令安裝專案所需的函式庫:
$ pnpm add @clerk/backend @nestjs/config @nestjs/passport passport passport-custom
環境配置
在專案的根目錄中建立一個 .env 檔案來管理不同環境、生產、開發或登台的變數。
新增下列變量,以從 Clerk 帳戶儀表板取得的實際金鑰取代佔位符。
# .env CLERK_PUBLISHABLE_KEY=YOUR_PUBLISHABLE_KEY CLERK_SECRET_KEY=YOUR_SECRET_KEY
要使用 ConfigService 存取整個應用程式中的環境變量,請將 ConfigModule 匯入根 AppModule。
// src/app.module.ts import { Module } from '@nestjs/common'; import { ConfigModule } from '@nestjs/config'; @Module({ imports: [ ConfigModule.forRoot({ isGlobal: true, }), ], }) export class AppModule {}
在 NestJS 中整合 Clerk
本節介紹如何在您的 NestJS 專案中整合和使用 Clerk 後端 SDK。
建立 Clerk 用戶端提供者
將 Clerk 用戶端註冊為提供程序,使其可以使用裝飾器注入到類別中,從而可以在整個程式碼庫中的任何需要的地方使用它,如接下來的部分所示。
$ pnpm add -g @nestjs/cli $ nest new clerk-auth
在 AppModule 中註冊 ClerkClientProvider
接下來,您需要向 Nest 註冊提供者以啟用依賴項注入。
$ pnpm add @clerk/backend @nestjs/config @nestjs/passport passport passport-custom
使用有職員簽發的 JWT 的護照
當使用者透過 Clerk 的託管頁面或前端應用程式註冊或登入時,Clerk 會發出 JWT 令牌。然後,此令牌會作為不記名令牌傳送到向 NestJS 後端應用程式發出的請求的授權標頭中。
制定文員策略
在NestJS中,Passport是建議的實作身分驗證策略的方式。您將建立一個自訂 Clerk 策略,用於使用 Clerk 用戶端驗證令牌。
# .env CLERK_PUBLISHABLE_KEY=YOUR_PUBLISHABLE_KEY CLERK_SECRET_KEY=YOUR_SECRET_KEY
validate() 方法傳回 NestJS 自動附加到 request.user 的使用者資料。
建立身份驗證模組
建立一個 AuthModule,它提供 Clerk 策略並與 PassportModule 整合。然後,在AppModule中註冊AuthModule。
// src/app.module.ts import { Module } from '@nestjs/common'; import { ConfigModule } from '@nestjs/config'; @Module({ imports: [ ConfigModule.forRoot({ isGlobal: true, }), ], }) export class AppModule {}
// src/providers/clerk-client.provider.ts import { createClerkClient } from '@clerk/backend'; import { ConfigService } from '@nestjs/config'; export const ClerkClientProvider = { provide: 'ClerkClient', useFactory: (configService: ConfigService) => { return createClerkClient({ publishableKey: configService.get('CLERK_PUBLISHABLE_KEY'), secretKey: configService.get('CLERK_SECRET_KEY'), }); }, inject: [ConfigService], };
實施路由保護
受保護的路由是需要使用者經過驗證才能存取的路由。
創建文員身份驗證守衛
守衛根據某些運行時條件決定特定請求是否應由路由處理程序處理。
如果您想要預設保護應用程式中的所有路由,則需要執行以下步驟:
- 建立一個公共裝飾器來標記無需身份驗證即可存取的路由。
- 實作 ClerkAuthGuard 來限制對受保護路由的訪問,僅允許經過身份驗證的使用者繼續。
// src/app.module.ts import { Module } from '@nestjs/common'; import { ConfigModule } from '@nestjs/config'; import { ClerkClientProvider } from 'src/providers/clerk-client.provider'; @Module({ imports: [ ConfigModule.forRoot({ isGlobal: true, }), ], providers: [ClerkClientProvider], }) export class AppModule {}
// src/auth/clerk.strategy.ts import { User, verifyToken } from '@clerk/backend'; import { Injectable, Injectable, UnauthorizedException } from '@nestjs/common'; import { ConfigService } from '@nestjs/config'; import { PassportStrategy } from '@nestjs/passport'; import { Strategy } from 'passport-custom'; import { UsersService } from 'src/users/users.service'; import { Request } from 'express'; import { ClerkClient } from '@clerk/backend'; @Injectable() export class ClerkStrategy extends PassportStrategy(Strategy, 'clerk') { constructor( @Inject('ClerkClient') private readonly clerkClient: ClerkClient, private readonly configService: ConfigService, ) { super(); } async validate(req: Request): Promise<User> { const token = req.headers.authorization?.split(' ').pop(); if (!token) { throw new UnauthorizedException('No token provided'); } try { const tokenPayload = await verifyToken(token, { secretKey: this.configService.get('CLERK_SECRET_KEY'), }); const user = await this.clerkClient.users.getUser(tokenPayload.sub); return user; } catch (error) { console.error(error); throw new UnauthorizedException('Invalid token'); } } }
全域啟用身份驗證
由於預設情況下您的大多數端點都會受到保護,因此您可以將身份驗證防護配置為全域防護。
// src/auth/auth.module.ts import { Module } from '@nestjs/common'; import { ClerkStrategy } from './clerk.strategy'; import { PassportModule } from '@nestjs/passport'; import { ClerkClientProvider } from 'src/providers/clerk-client.provider'; import { ConfigModule } from '@nestjs/config'; @Module({ imports: [PassportModule, ConfigModule], providers: [ClerkStrategy, ClerkClientProvider], exports: [PassportModule], }) export class AuthModule {}
定義受保護的公共路線
在這兩個控制器中,AppController 中使用 Public 裝飾器來將路由指定為公用。相較之下,AuthController 中不需要裝飾器來將路由指定為受保護,因為身份驗證防護預設情況下全域應用。
// src/app.module.ts import { Module } from '@nestjs/common'; import { ConfigModule } from '@nestjs/config'; import { ClerkClientProvider } from 'src/providers/clerk-client.provider'; import { AuthModule } from 'src/auth/auth.module'; @Module({ imports: [ ConfigModule.forRoot({ isGlobal: true, }), AuthModule, ], providers: [ClerkClientProvider], }) export class AppModule {}
// src/decorators/public.decorator.ts import { SetMetadata } from '@nestjs/common'; export const IS_PUBLIC_KEY = 'isPublic'; export const Public = () => SetMetadata(IS_PUBLIC_KEY, true);
注意:記得在AppModule中註冊AppController,在AuthModule中註冊AuthController。
結論
Clerk 作為一個平台,負責處理身份驗證和安全責任,緊跟最新趨勢和最佳實踐。這使您能夠專注於建立應用程式的核心功能並加速您的開發過程。
在本指南中,我們介紹了實作 Clerk 驗證的步驟,從設定項目到保護路由。這些基本步驟應該可以幫助您開始探索身分驗證服務平台的可能性。
本文末包含該項目的完整功能範例。
達米王
/
職員巢授權
在 NestJS 後端應用程式中使用 Clerk 身份驗證和使用者管理
Clerk-NestJS 驗證
在 NestJS 後端應用程式中使用 Clerk 驗證和使用者管理
裡面有什麼?
這個 monorepo 包含以下軟體包和應用程式:
應用程式和軟體包
- api:一個 NestJS 應用
每個套件和應用程式都是 100% TypeScript。
實用工具
這個 monorepo 已經為您設定了一些附加工具:
- 用於靜態類型檢查的 TypeScript
- 用於程式碼檢查的 ESLint
- 程式碼格式更漂亮
以上是在 NestJS 伺服器應用程式中使用 Clerk 進行身份驗證的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

JavaScript是現代Web開發的基石,它的主要功能包括事件驅動編程、動態內容生成和異步編程。 1)事件驅動編程允許網頁根據用戶操作動態變化。 2)動態內容生成使得頁面內容可以根據條件調整。 3)異步編程確保用戶界面不被阻塞。 JavaScript廣泛應用於網頁交互、單頁面應用和服務器端開發,極大地提升了用戶體驗和跨平台開發的靈活性。

JavaScript的最新趨勢包括TypeScript的崛起、現代框架和庫的流行以及WebAssembly的應用。未來前景涵蓋更強大的類型系統、服務器端JavaScript的發展、人工智能和機器學習的擴展以及物聯網和邊緣計算的潛力。

不同JavaScript引擎在解析和執行JavaScript代碼時,效果會有所不同,因為每個引擎的實現原理和優化策略各有差異。 1.詞法分析:將源碼轉換為詞法單元。 2.語法分析:生成抽象語法樹。 3.優化和編譯:通過JIT編譯器生成機器碼。 4.執行:運行機器碼。 V8引擎通過即時編譯和隱藏類優化,SpiderMonkey使用類型推斷系統,導致在相同代碼上的性能表現不同。

JavaScript是現代Web開發的核心語言,因其多樣性和靈活性而廣泛應用。 1)前端開發:通過DOM操作和現代框架(如React、Vue.js、Angular)構建動態網頁和單頁面應用。 2)服務器端開發:Node.js利用非阻塞I/O模型處理高並發和實時應用。 3)移動和桌面應用開發:通過ReactNative和Electron實現跨平台開發,提高開發效率。

Python更適合初學者,學習曲線平緩,語法簡潔;JavaScript適合前端開發,學習曲線較陡,語法靈活。 1.Python語法直觀,適用於數據科學和後端開發。 2.JavaScript靈活,廣泛用於前端和服務器端編程。

本文展示了與許可證確保的後端的前端集成,並使用Next.js構建功能性Edtech SaaS應用程序。 前端獲取用戶權限以控制UI的可見性並確保API要求遵守角色庫

從C/C 轉向JavaScript需要適應動態類型、垃圾回收和異步編程等特點。 1)C/C 是靜態類型語言,需手動管理內存,而JavaScript是動態類型,垃圾回收自動處理。 2)C/C 需編譯成機器碼,JavaScript則為解釋型語言。 3)JavaScript引入閉包、原型鍊和Promise等概念,增強了靈活性和異步編程能力。

我使用您的日常技術工具構建了功能性的多租戶SaaS應用程序(一個Edtech應用程序),您可以做同樣的事情。 首先,什麼是多租戶SaaS應用程序? 多租戶SaaS應用程序可讓您從唱歌中為多個客戶提供服務
