首頁 >web前端 >js教程 >Bluesky OAuthlient,使用 Vanilla JavaScript

Bluesky OAuthlient,使用 Vanilla JavaScript

Susan Sarandon
Susan Sarandon原創
2025-01-22 08:34:10435瀏覽

這篇文章詳細介紹了僅使用 Vanilla JavaScript 將 Bluesky Authentication (OAuth DPoP) 整合到無伺服器客戶端應用程式中。 由於令牌過期,這是一個概念圖,而不是一個功能齊全的範例。

Bluesky OAuthlient, with Vanilla JavaScript

簡介

我們將探索如何在 JavaScript 應用程式中實作 Bluesky 身份驗證,而不依賴外部框架。

免責聲明

這是一個示範該過程的教學。 由於身份驗證令牌的短暫性,它不能作為獨立、永久工作的範例。 請報告任何錯誤。

OAuth 驗證

對於需要用戶身份驗證的無伺服器應用程序,我們可以利用 Bluesky 等第三方權威機構。 這使用 OAuth 2.0 協定。 有關 Bluesky OAuth 實現的更多詳細信息,請參閱 OAuth - AT 協議文件。

客戶端元資料

要使用 Bluesky 驗證,我們的應用程式需要被 Bluesky 的身份驗證伺服器識別。這是透過包含應用程式資訊的客戶端元資料檔案(例如 client-metadata.json)來實現的。 這允許自動客戶端註冊,無需手動伺服器註冊。 元資料檔案必須可透過 HTTPS 存取。

範例元資料檔(可在https://www.php.cn/link/db817217c5d9b196aa39cfeb0ce889e4存取):

<code class="language-json">{
  "client_id":"https://www.php.cn/link/db817217c5d9b196aa39cfeb0ce889e4",
  "application_type":"web",
  "grant_types":[
    "authorization_code",
    "refresh_token"
  ],
  "scope":"atproto transition:generic transition:chat.bsky",
  "response_types":[
    "code id_token",
    "code"
  ],
  "redirect_uris":[
    "https://madrilenyer.neocities.org/bsky/oauth/callback/"
  ],
  "dpop_bound_access_tokens":true,
  "token_endpoint_auth_method":"none",
  "client_name":"Madrilenyer Example Browser App",
  "client_uri":"https://madrilenyer.neocities.org/bsky/"
}</code>

此檔案描述了我們在 Bluesky 驗證伺服器上的應用程式。

核心驗證要求

要對使用者進行身份驗證,我們至少需要他們的 Bluesky 句柄。 該句柄是 Bluesky 個人資料 URL 中 https://bsky.app/profile/.

之後的部分

檢索使用者資料

  1. 檢索 DID:給定使用者的句柄,我們可以使用 API 呼叫(例如 https://bsky.social/xrpc/com.atproto.identity.resolveHandle?handle=<handle>)來取得他們的去中心化識別碼 (DID)。

  2. 檢索 DID 文件: 使用 DID,我們從 PLC API (https://plc.directory/<did>) 檢索 DID 文件。 此文件包含使用者的 PDS(個人資料伺服器)URL。

  3. 檢索 PDS 元資料: PDS URL(DID 文件中的 serviceEndpoint)用於從 /.well-known/oauth-protected-resource 取得 PDS 元資料。此元資料提供授權伺服器 URL。

  4. 授權伺服器發現: 授權伺服器 URL 用於從​​ /.well-known/oauth-authorization-server 檢索其元資料。 此元資料包含關鍵端點,例如授權端點、令牌端點和推送授權請求 (PAR) 端點。

後續步驟涉及使用發現的端點和 PKCE(代碼交換證明金鑰)獲取使用者的存取權杖、涉及 PAR 請求的過程、用於增強安全性的 DPoP(演示所有權證明)以及處理重定向。 雖然為簡潔起見而省略了這些步驟的詳細 Javascript 程式碼,但它們將涉及進行多個 API 呼叫並處理回應。 官方 Bluesky TypeScript 用戶端是生產應用程式的更強大且推薦的替代方案。

以上是Bluesky OAuthlient,使用 Vanilla JavaScript的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn