Merge pull request #1 from fatfingers23/feat/atproto-oauth

Feat/atproto oauth

Author: zeucapua

.env.example

@@ -0,0 +1,2 @@
+#secure password, can use openssl rand --hex 32
+NUXT_SESSION_PASSWORD=""

app/composables/useRepoMeta.ts

@@ -595,7 +595,7 @@ const tangledAdapter: ProviderAdapter = {
         try {
           //Get counts of records that reference this repo in the atmosphere using constellation
           const allLinks = await cachedFetch<ConstellationAllLinksResponse>(
-            `https://constellation.microcosm.blue/links/all?target=${atUri}`,
+            `${CONSTELLATION_ENDPOINT}/links/all?target=${atUri}`,
             { headers: { 'User-Agent': 'npmx' } },
             REPO_META_TTL,
           )

nuxt.config.ts

@@ -124,6 +124,14 @@ export default defineNuxtConfig({
         driver: 'fsLite',
         base: './.cache/fetch',
       },
+      'oauth-atproto-state': {
+        driver: 'fsLite',
+        base: './.cache/atproto-oauth/state',
+      },
+      'oauth-atproto-session': {
+        driver: 'fsLite',
+        base: './.cache/atproto-oauth/session',
+      },
     },
   },
 

server/api/auth/atproto.get.ts

@@ -1,20 +1,14 @@
-import type { H3Event } from 'h3'
 import { Agent } from '@atproto/api'
 import { NodeOAuthClient } from '@atproto/oauth-client-node'
-import type {
-  NodeSavedSession,
-  NodeSavedSessionStore,
-  NodeSavedState,
-  NodeSavedStateStore,
-} from '@atproto/oauth-client-node'
-import { scope, getOauthClientMetadata } from '~~/server/utils/atproto'
-import { createError, getQuery, sendRedirect, getCookie, setCookie, deleteCookie } from 'h3'
+import { createError, getQuery, sendRedirect } from 'h3'
+import { OAuthSessionStore, OAuthStateStore } from '#server/utils/atproto/storage'
+import { SLINGSHOT_ENDPOINT } from '#shared/utils/constants'
 
 export default defineEventHandler(async event => {
   const query = getQuery(event)
   const clientMetadata = getOauthClientMetadata()
-  const stateStore = new StateStore(event)
-  const sessionStore = new SessionStore(event)
+  const stateStore = new OAuthStateStore(event)
+  const sessionStore = new OAuthSessionStore(event)
   const atclient = new NodeOAuthClient({
     stateStore,
     sessionStore,
@@ -46,55 +40,14 @@ export default defineEventHandler(async event => {
   })
 
   const response = await fetch(
-    `https://slingshot.microcosm.blue/xrpc/com.bad-example.identity.resolveMiniDoc?identifier=${agent.did}`,
+    `${SLINGSHOT_ENDPOINT}/xrpc/com.bad-example.identity.resolveMiniDoc?identifier=${agent.did}`,
+    { headers: { 'User-Agent': 'npmx' } },
   )
   const miniDoc = (await response.json()) as { did: string; handle: string; pds: string }
 
   await session.update({
     miniDoc,
   })
 
-  await sessionStore.del()
-
   return sendRedirect(event, '/')
 })
-
-export class StateStore implements NodeSavedStateStore {
-  private readonly stateKey = 'oauth:bluesky:stat'
-
-  constructor(private event: H3Event) {}
-
-  async get(): Promise<NodeSavedState | undefined> {
-    const result = getCookie(this.event, this.stateKey)
-    if (!result) return
-    return JSON.parse(atob(result))
-  }
-
-  async set(key: string, val: NodeSavedState) {
-    setCookie(this.event, this.stateKey, btoa(JSON.stringify(val)))
-  }
-
-  async del() {
-    deleteCookie(this.event, this.stateKey)
-  }
-}
-
-export class SessionStore implements NodeSavedSessionStore {
-  private readonly sessionKey = 'oauth:bluesky:session'
-
-  constructor(private event: H3Event) {}
-
-  async get(): Promise<NodeSavedSession | undefined> {
-    const result = getCookie(this.event, this.sessionKey)
-    if (!result) return
-    return JSON.parse(atob(result))
-  }
-
-  async set(key: string, val: NodeSavedSession) {
-    setCookie(this.event, this.sessionKey, btoa(JSON.stringify(val)))
-  }
-
-  async del() {
-    deleteCookie(this.event, this.sessionKey)
-  }
-}

server/api/auth/session.delete.ts

@@ -1,8 +1,11 @@
-export default defineEventHandler(async event => {
+import { eventHandlerWithOAuthSession } from '#server/utils/oauth'
+
+export default eventHandlerWithOAuthSession(async (event, oAuthSession) => {
   const session = await useSession(event, {
     password: process.env.NUXT_SESSION_PASSWORD as string,
   })
 
+  await oAuthSession?.signOut()
   await session.clear()
 
   return 'Session cleared'

server/utils/atproto.ts

@@ -0,0 +1,64 @@
+import type { OAuthClientMetadataInput } from '@atproto/oauth-client-node'
+import type { EventHandlerRequest, H3Event } from 'h3'
+import type { OAuthSession } from '@atproto/oauth-client-node'
+import { NodeOAuthClient } from '@atproto/oauth-client-node'
+import { OAuthSessionStore, OAuthStateStore } from '#server/utils/atproto/storage'
+
+// TODO: limit scope as features gets added. atproto just allows login so no scary login screen till we have scopes
+export const scope = 'atproto'
+
+export function getOauthClientMetadata() {
+  const dev = import.meta.dev
+
+  // on dev, match in nuxt.config.ts devServer: { host: "127.0.0.1" }
+  const client_uri = dev ? `http://127.0.0.1:3000` : 'https://npmx.dev'
+  const redirect_uri = `${client_uri}/api/auth/atproto`
+
+  const client_id = dev
+    ? `http://localhost?redirect_uri=${encodeURIComponent(redirect_uri)}&scope=${encodeURIComponent(scope)}`
+    : `${client_uri}/oauth-client-metadata.json`
+
+  return {
+    client_name: 'npmx.dev',
+    client_id,
+    client_uri,
+    scope,
+    redirect_uris: [redirect_uri] as [string, ...string[]],
+    grant_types: ['authorization_code', 'refresh_token'],
+    application_type: 'web',
+    token_endpoint_auth_method: 'none',
+    dpop_bound_access_tokens: true,
+  } as OAuthClientMetadataInput
+}
+
+type EventHandlerWithOAuthSession<T extends EventHandlerRequest, D> = (
+  event: H3Event<T>,
+  session: OAuthSession | undefined,
+) => Promise<D>
+
+async function getOAuthSession(event: H3Event): Promise<OAuthSession | undefined> {
+  const clientMetadata = getOauthClientMetadata()
+  const stateStore = new OAuthStateStore(event)
+  const sessionStore = new OAuthSessionStore(event)
+
+  const client = new NodeOAuthClient({
+    stateStore,
+    sessionStore,
+    clientMetadata,
+  })
+
+  const currentSession = await sessionStore.get()
+  if (!currentSession) return undefined
+
+  // restore using the subject
+  return await client.restore(currentSession.tokenSet.sub)
+}
+
+export function eventHandlerWithOAuthSession<T extends EventHandlerRequest, D>(
+  handler: EventHandlerWithOAuthSession<T, D>,
+) {
+  return defineEventHandler(async event => {
+    const oAuthSession = await getOAuthSession(event)
+    return await handler(event, oAuthSession)
+  })
+}

server/utils/atproto/oauth.ts

@@ -0,0 +1,74 @@
+import type {
+  NodeSavedSession,
+  NodeSavedSessionStore,
+  NodeSavedState,
+  NodeSavedStateStore,
+} from '@atproto/oauth-client-node'
+import type { H3Event } from 'h3'
+
+/**
+ * Storage key prefix for oauth state storage.
+ */
+export const OAUTH_STATE_CACHE_STORAGE_BASE = 'oauth-atproto-state'
+
+export class OAuthStateStore implements NodeSavedStateStore {
+  private readonly cookieKey = 'oauth:atproto:state'
+  private readonly storage = useStorage(OAUTH_STATE_CACHE_STORAGE_BASE)
+
+  constructor(private event: H3Event) {}
+
+  async get(): Promise<NodeSavedState | undefined> {
+    const stateKey = getCookie(this.event, this.cookieKey)
+    if (!stateKey) return
+    const result = await this.storage.getItem<NodeSavedState>(stateKey)
+    if (!result) return
+    return result
+  }
+
+  async set(key: string, val: NodeSavedState) {
+    setCookie(this.event, this.cookieKey, key)
+    await this.storage.setItem<NodeSavedState>(key, val)
+  }
+
+  async del() {
+    let stateKey = getCookie(this.event, this.cookieKey)
+    deleteCookie(this.event, this.cookieKey)
+    if (stateKey) {
+      await this.storage.del(stateKey)
+    }
+  }
+}
+
+/**
+ * Storage key prefix for oauth session storage.
+ */
+export const OAUTH_SESSION_CACHE_STORAGE_BASE = 'oauth-atproto-session'
+
+export class OAuthSessionStore implements NodeSavedSessionStore {
+  //TODO not sure if we will support multi accounts, but if we do in the future will need to change this around
+  private readonly cookieKey = 'oauth:atproto:session'
+  private readonly storage = useStorage(OAUTH_SESSION_CACHE_STORAGE_BASE)
+
+  constructor(private event: H3Event) {}
+
+  async get(): Promise<NodeSavedSession | undefined> {
+    const sessionKey = getCookie(this.event, this.cookieKey)
+    if (!sessionKey) return
+    let result = await this.storage.getItem<NodeSavedSession>(sessionKey)
+    if (!result) return
+    return result
+  }
+
+  async set(key: string, val: NodeSavedSession) {
+    setCookie(this.event, this.cookieKey, key)
+    await this.storage.setItem<NodeSavedSession>(key, val)
+  }
+
+  async del() {
+    let sessionKey = getCookie(this.event, this.cookieKey)
+    if (sessionKey) {
+      await this.storage.del(sessionKey)
+    }
+    deleteCookie(this.event, this.cookieKey)
+  }
+}

server/utils/atproto/storage.ts

@@ -17,6 +17,10 @@ export const ERROR_JSR_FETCH_FAILED = 'Failed to fetch package from JSR registry
 export const ERROR_NPM_FETCH_FAILED = 'Failed to fetch package from npm registry.'
 export const ERROR_SUGGESTIONS_FETCH_FAILED = 'Failed to fetch suggestions.'
 
+// microcosm services
+export const CONSTELLATION_ENDPOINT = 'https://constellation.microcosm.blue'
+export const SLINGSHOT_ENDPOINT = 'https://slingshot.microcosm.blue'
+
 // Theming
 export const ACCENT_COLORS = {
   rose: 'oklch(0.797 0.084 11.056)',

shared/utils/constants.ts

@@ -5,6 +5,8 @@
  * using Nitro's storage layer (backed by Vercel's runtime cache in production).
  */
 
+import { CONSTELLATION_ENDPOINT, SLINGSHOT_ENDPOINT } from './constants'
+
 /**
  * Domains that should have their fetch responses cached.
  * Only requests to these domains will be intercepted and cached.
@@ -24,6 +26,9 @@ export const FETCH_CACHE_ALLOWED_DOMAINS = [
   'api.bitbucket.org', // Bitbucket API
   'codeberg.org', // Codeberg (Gitea-based)
   'gitee.com', // Gitee API
+  //microcosm endpoints for atproto data
+  CONSTELLATION_ENDPOINT,
+  SLINGSHOT_ENDPOINT,
 ] as const
 
 /**