@atproto/oauth-provider 0.5.2 → 0.6.1

package/src/output/output-manager.ts

@@ -1,8 +1,10 @@
 import type { ServerResponse } from 'node:http'
-import { Asset } from '../assets/asset.js'
-import { enumerateAssets } from '../assets/index.js'
+import { CustomizationData } from '@atproto/oauth-provider-api'
+import { assets } from '@atproto/oauth-provider-ui'
+import { buildAssetUrl } from '../assets/assets-middleware.js'
 import { CspConfig, mergeCsp } from '../lib/csp/index.js'
 import {
+  AssetRef,
   Html,
   LinkAttrs,
   MetaAttrs,
@@ -10,7 +12,9 @@ import {
   html,
   isLinkRel,
 } from '../lib/html/index.js'
+import { CrossOriginEmbedderPolicy } from '../lib/http/security-headers.js'
 import { AVAILABLE_LOCALES, Locale, isAvailableLocale } from '../lib/locale.js'
+import { declareBackendData } from './backend-data.js'
 import {
   AuthorizationResultAuthorize,
   buildAuthorizeData,
@@ -21,15 +25,28 @@ import {
   buildCustomizationCss,
   buildCustomizationData,
 } from './build-customization-data.js'
-import { buildErrorPayload, buildErrorStatus } from './build-error-payload.js'
-import { assetToCsp, declareBackendData, sendWebPage } from './send-web-page.js'
+import { buildErrorData } from './build-error-data.js'
+import { buildErrorStatus } from './build-error-payload.js'
+import { sendWebPage } from './send-web-page.js'
+
+const BASE_CSP: CspConfig = {
+  // API calls are made to the same origin
+  'connect-src': ["'self'"],
+  // Allow loading of PDS logo & User avatars
+  'img-src': ['data:', 'https:'],
+  // Prevent embedding in iframes
+  'frame-ancestors': ["'none'"],
+}
 
-const HCAPTCHA_CSP = {
+/**
+ * @see {@link https://docs.hcaptcha.com/#content-security-policy-settings}
+ */
+const HCAPTCHA_CSP: CspConfig = {
   'script-src': ['https://hcaptcha.com', 'https://*.hcaptcha.com'],
   'frame-src': ['https://hcaptcha.com', 'https://*.hcaptcha.com'],
   'style-src': ['https://hcaptcha.com', 'https://*.hcaptcha.com'],
   'connect-src': ['https://hcaptcha.com', 'https://*.hcaptcha.com'],
-} as const satisfies CspConfig
+}
 
 export type SendPageOptions = {
   preferredLocales?: readonly string[]
@@ -41,43 +58,57 @@ export class OutputManager {
     { name: 'robots', content: 'noindex' },
     { name: 'description', content: 'ATProto OAuth authorization page' },
   ]
-  readonly scripts: readonly (Asset | Html)[]
-  readonly styles: readonly (Asset | Html)[]
   readonly csp: CspConfig
+  readonly coep: CrossOriginEmbedderPolicy
+  readonly customizationData: CustomizationData
+  readonly customizationCss: Html
 
   constructor(customization: Customization) {
     this.links = customization.branding?.links
 
-    const scripts = Array.from(enumerateAssets('application/javascript'))
-    const styles = Array.from(enumerateAssets('text/css'))
-
-    // Note: building scripts/styles/csp here for two reasons:
-    // 1. To avoid re-building it on every request
-    // 2. To throw during init if the customization/config is invalid
-
-    this.scripts = [
-      declareBackendData('__availableLocales', AVAILABLE_LOCALES),
-      declareBackendData(
-        '__customizationData',
-        buildCustomizationData(customization),
-      ),
-      // Last (to be able to read the "backend data" variables)
-      ...scripts.filter((asset) => asset.isEntry),
-    ]
-
-    this.styles = [
-      // First (to be overridden by customization)
-      ...styles,
-      cssCode(buildCustomizationCss(customization)),
-    ]
-
-    const customizationCsp = customization?.hcaptcha ? HCAPTCHA_CSP : undefined
-    const assetsCsp: CspConfig = {
-      'script-src': scripts.map(assetToCsp),
-      'style-src': styles.map(assetToCsp),
-    }
+    // "cache" these:
+    this.customizationData = buildCustomizationData(customization)
+    this.customizationCss = cssCode(buildCustomizationCss(customization))
 
-    this.csp = mergeCsp(customizationCsp, assetsCsp)
+    this.csp = mergeCsp(
+      BASE_CSP,
+      customization?.hcaptcha ? HCAPTCHA_CSP : undefined,
+    )
+    // Because we are loading avatar images from external sources, that might
+    // not have CORP headers set, we need to use at least "credentialless".
+    this.coep = customization?.hcaptcha
+      ? // https://github.com/hCaptcha/react-hcaptcha/issues/259
+        // @TODO Remove the use of `unsafeNone` once the issue above is resolved
+        CrossOriginEmbedderPolicy.unsafeNone
+      : CrossOriginEmbedderPolicy.credentialless
+  }
+
+  buildAssets(
+    name: string,
+    backendData: Record<string, unknown>,
+  ): {
+    scripts: (AssetRef | Html)[]
+    styles: (AssetRef | Html)[]
+  } {
+    return {
+      scripts: [
+        declareBackendData(backendData),
+        // After backend injected data
+        ...Array.from(assets)
+          .filter(
+            ([, item]) =>
+              item.type === 'chunk' && item.isEntry && item.name === name,
+          )
+          .map(([filename]) => ({ url: buildAssetUrl(filename) })),
+      ],
+      styles: [
+        ...Array.from(assets)
+          .filter(([, item]) => item.mime === 'text/css')
+          .map(([filename]) => ({ url: buildAssetUrl(filename) })),
+        // Last (to be able to override the default styles)
+        this.customizationCss,
+      ],
+    }
   }
 
   async sendAuthorizePage(
@@ -89,17 +120,21 @@ export class OutputManager {
       data.parameters.ui_locales?.split(' ') ?? options?.preferredLocales,
     )
 
+    const { scripts, styles } = this.buildAssets('authorization-page', {
+      __availableLocales: AVAILABLE_LOCALES,
+      __customizationData: this.customizationData,
+      __authorizeData: buildAuthorizeData(data),
+    })
+
     return sendWebPage(res, {
-      scripts: [
-        declareBackendData('__authorizeData', buildAuthorizeData(data)),
-        ...this.scripts,
-      ],
-      styles: this.styles,
+      scripts,
+      styles,
       meta: this.meta,
       links: this.buildLinks(locale),
       htmlAttrs: { lang: locale },
       body: html`<div id="root"></div>`,
       csp: this.csp,
+      coep: this.coep,
     })
   }
 
@@ -110,18 +145,22 @@ export class OutputManager {
   ): Promise<void> {
     const locale = negotiateLocale(options?.preferredLocales)
 
+    const { scripts, styles } = this.buildAssets('error-page', {
+      __availableLocales: AVAILABLE_LOCALES,
+      __customizationData: this.customizationData,
+      __errorData: buildErrorData(err),
+    })
+
     return sendWebPage(res, {
       status: buildErrorStatus(err),
-      scripts: [
-        declareBackendData('__errorData', buildErrorPayload(err)),
-        ...this.scripts,
-      ],
-      styles: this.styles,
+      scripts,
+      styles,
       meta: this.meta,
       links: this.buildLinks(locale),
       htmlAttrs: { lang: locale },
       body: html`<div id="root"></div>`,
       csp: this.csp,
+      coep: this.coep,
     })
   }
 

package/src/output/send-web-page.ts

@@ -1,82 +1,53 @@
 import { createHash } from 'node:crypto'
 import type { ServerResponse } from 'node:http'
-import { CspConfig, CspValue, buildCsp, mergeCsp } from '../lib/csp/index.js'
+import { CspConfig, CspValue, mergeCsp } from '../lib/csp/index.js'
 import {
   AssetRef,
   BuildDocumentOptions,
   Html,
   buildDocument,
-  js,
 } from '../lib/html/index.js'
-import { WriteResponseOptions, writeHtml } from '../lib/http/response.js'
+import { WriteHtmlOptions, writeHtml } from '../lib/http/response.js'
 
-export function declareBackendData(name: string, data: unknown) {
-  // The script tag is removed after the data is assigned to the global variable
-  // to prevent other scripts from deducing the value of the variable. The "app"
-  // script will read the global variable and then unset it. See
-  // "readBackendData" in "src/assets/app/backend-types.ts".
-  return js`window[${name}]=${data};document.currentScript.remove();`
+export const DEFAULT_CSP: CspConfig = {
+  'upgrade-insecure-requests': true,
+  'default-src': ["'none'"],
 }
 
-export type SendWebPageOptions = BuildDocumentOptions &
-  WriteResponseOptions & {
-    csp?: CspConfig
-  }
+export type SendWebPageOptions = BuildDocumentOptions & WriteHtmlOptions
 
 export async function sendWebPage(
   res: ServerResponse,
-  options: SendWebPageOptions,
+  { csp: inputCsp, ...options }: SendWebPageOptions,
 ): Promise<void> {
-  const csp = mergeCsp(options.csp, {
-    'default-src': ["'none'"],
+  // @NOTE the csp string might be quite long. In that case it might be tempting
+  // to set it through the http-equiv <meta> in the HTML. However, some
+  // directives cannot be enforced by browsers when set through the meta tag
+  // (e.g. 'frame-ancestors'). Therefore, it's better to set the CSP through the
+  // HTTP header.
+  const csp = mergeCsp(DEFAULT_CSP, inputCsp, {
     'base-uri': options.base?.origin as undefined | `https://${string}`,
-    'script-src': ["'self'", ...assetsToCsp(options.scripts)],
-    'style-src': ["'self'", ...assetsToCsp(options.styles)],
-    'img-src': ["'self'", 'data:', 'https:'],
-    'connect-src': ["'self'"],
-    'upgrade-insecure-requests': true,
-
-    // Prevents the CSP to be embedded in a page <meta>:
-    'frame-ancestors': ["'none'"],
+    'script-src': options.scripts?.map(assetToCsp),
+    'style-src': options.styles?.map(assetToCsp),
   })
 
-  // @NOTE the csp string might become too long. However, since we need to
-  // specify the "frame-ancestors" directive, we can't use a meta tag. For that
-  // reason, we won't try to avoid too long headers and let the proxy throw
-  // in case of a too long header.
-  res.setHeader('Content-Security-Policy', buildCsp(csp))
-
-  // @TODO: make these headers configurable (?)
-  res.setHeader('Permissions-Policy', 'otp-credentials=*, document-domain=()')
-  res.setHeader('Cross-Origin-Embedder-Policy', 'credentialless')
-  res.setHeader('Cross-Origin-Resource-Policy', 'same-origin')
-  res.setHeader('Cross-Origin-Opener-Policy', 'same-origin')
-  res.setHeader('Referrer-Policy', 'same-origin')
-  res.setHeader('X-Frame-Options', 'DENY')
-  res.setHeader('X-Content-Type-Options', 'nosniff')
-  res.setHeader('X-XSS-Protection', '0')
-  res.setHeader('Strict-Transport-Security', 'max-age=63072000')
-
-  const html = buildDocument(options)
-
-  return writeHtml(res, html.toString(), options)
+  const html = buildDocument(options).toString()
+  return writeHtml(res, html, { ...options, csp })
 }
 
-export function* assetsToCsp(
-  assets?: Iterable<Html | AssetRef>,
-): Generator<CspValue> {
-  if (assets) {
-    for (const asset of assets) {
-      yield assetToCsp(asset)
-    }
-  }
-}
-
-export function assetToCsp(asset: Html | AssetRef): CspValue {
+function assetToCsp(asset: Html | AssetRef): CspValue {
   if (asset instanceof Html) {
-    const hash = createHash('sha256').update(asset.toString()).digest('base64')
-    return `'sha256-${hash}'`
+    // Inline assets are "allowed" by their hash
+    const hash = createHash('sha256')
+    for (const fragment of asset) hash.update(fragment)
+    return `'sha256-${hash.digest('base64')}'`
   } else {
-    return `'sha256-${asset.sha256}'`
+    // External assets are referenced by their origin
+    if (asset.url.startsWith('https:') || asset.url.startsWith('http:')) {
+      return new URL(asset.url).origin as `https:${string}` | `http:${string}`
+    }
+
+    // Internal assets are served from the same origin
+    return `'self'`
   }
 }

package/tsconfig.backend.json

@@ -4,6 +4,5 @@
     "outDir": "dist",
     "rootDir": "src"
   },
-  "include": ["src"],
-  "exclude": ["src/assets/app"]
+  "include": ["src"]
 }

package/tsconfig.backend.tsbuildinfo

@@ -1 +1 @@
-{"root":["./src/constants.ts","./src/index.ts","./src/oauth-client.ts","./src/oauth-dpop.ts","./src/oauth-errors.ts","./src/oauth-hooks.ts","./src/oauth-provider.ts","./src/oauth-store.ts","./src/oauth-verifier.ts","./src/access-token/access-token-type.ts","./src/account/account-manager.ts","./src/account/account-store.ts","./src/account/account.ts","./src/account/sign-in-data.ts","./src/account/sign-up-data.ts","./src/assets/asset.ts","./src/assets/assets-middleware.ts","./src/assets/index.ts","./src/client/client-auth.ts","./src/client/client-data.ts","./src/client/client-id.ts","./src/client/client-info.ts","./src/client/client-manager.ts","./src/client/client-store.ts","./src/client/client-utils.ts","./src/client/client.ts","./src/device/device-data.ts","./src/device/device-id.ts","./src/device/device-manager.ts","./src/device/device-store.ts","./src/device/session-id.ts","./src/dpop/dpop-manager.ts","./src/dpop/dpop-nonce.ts","./src/errors/access-denied-error.ts","./src/errors/account-selection-required-error.ts","./src/errors/consent-required-error.ts","./src/errors/handle-unavailable-error.ts","./src/errors/invalid-authorization-details-error.ts","./src/errors/invalid-client-error.ts","./src/errors/invalid-client-id-error.ts","./src/errors/invalid-client-metadata-error.ts","./src/errors/invalid-dpop-key-binding-error.ts","./src/errors/invalid-dpop-proof-error.ts","./src/errors/invalid-grant-error.ts","./src/errors/invalid-invite-code-error.ts","./src/errors/invalid-parameters-error.ts","./src/errors/invalid-redirect-uri-error.ts","./src/errors/invalid-request-error.ts","./src/errors/invalid-scope-error.ts","./src/errors/invalid-token-error.ts","./src/errors/login-required-error.ts","./src/errors/oauth-error.ts","./src/errors/second-authentication-factor-required-error.ts","./src/errors/unauthorized-client-error.ts","./src/errors/use-dpop-nonce-error.ts","./src/errors/www-authenticate-error.ts","./src/lib/hcaptcha.ts","./src/lib/locale.ts","./src/lib/redis.ts","./src/lib/csp/index.ts","./src/lib/html/build-document.ts","./src/lib/html/escapers.ts","./src/lib/html/html.ts","./src/lib/html/index.ts","./src/lib/html/tags.ts","./src/lib/html/util.ts","./src/lib/http/accept.ts","./src/lib/http/context.ts","./src/lib/http/index.ts","./src/lib/http/method.ts","./src/lib/http/middleware.ts","./src/lib/http/parser.ts","./src/lib/http/path.ts","./src/lib/http/request.ts","./src/lib/http/response.ts","./src/lib/http/route.ts","./src/lib/http/router.ts","./src/lib/http/stream.ts","./src/lib/http/types.ts","./src/lib/http/url.ts","./src/lib/util/authorization-header.ts","./src/lib/util/cast.ts","./src/lib/util/crypto.ts","./src/lib/util/date.ts","./src/lib/util/function.ts","./src/lib/util/hostname.ts","./src/lib/util/redirect-uri.ts","./src/lib/util/time.ts","./src/lib/util/type.ts","./src/lib/util/well-known.ts","./src/metadata/build-metadata.ts","./src/oidc/sub.ts","./src/output/build-authorize-data.ts","./src/output/build-customization-data.ts","./src/output/build-error-payload.ts","./src/output/output-manager.ts","./src/output/send-authorize-redirect.ts","./src/output/send-web-page.ts","./src/replay/replay-manager.ts","./src/replay/replay-store-memory.ts","./src/replay/replay-store-redis.ts","./src/replay/replay-store.ts","./src/request/code.ts","./src/request/request-data.ts","./src/request/request-id.ts","./src/request/request-info.ts","./src/request/request-manager.ts","./src/request/request-store-memory.ts","./src/request/request-store-redis.ts","./src/request/request-store.ts","./src/request/request-uri.ts","./src/signer/signed-token-payload.ts","./src/signer/signer.ts","./src/token/refresh-token.ts","./src/token/token-claims.ts","./src/token/token-data.ts","./src/token/token-id.ts","./src/token/token-manager.ts","./src/token/token-store.ts","./src/token/verify-token-claims.ts"],"version":"5.6.3"}
+{"root":["./src/constants.ts","./src/index.ts","./src/oauth-client.ts","./src/oauth-dpop.ts","./src/oauth-errors.ts","./src/oauth-hooks.ts","./src/oauth-provider.ts","./src/oauth-store.ts","./src/oauth-verifier.ts","./src/access-token/access-token-type.ts","./src/account/account-manager.ts","./src/account/account-store.ts","./src/account/account.ts","./src/account/sign-in-data.ts","./src/account/sign-up-input.ts","./src/assets/assets-middleware.ts","./src/client/client-auth.ts","./src/client/client-data.ts","./src/client/client-id.ts","./src/client/client-info.ts","./src/client/client-manager.ts","./src/client/client-store.ts","./src/client/client-utils.ts","./src/client/client.ts","./src/device/device-data.ts","./src/device/device-id.ts","./src/device/device-manager.ts","./src/device/device-store.ts","./src/device/session-id.ts","./src/dpop/dpop-manager.ts","./src/dpop/dpop-nonce.ts","./src/errors/access-denied-error.ts","./src/errors/account-selection-required-error.ts","./src/errors/consent-required-error.ts","./src/errors/handle-unavailable-error.ts","./src/errors/invalid-authorization-details-error.ts","./src/errors/invalid-client-error.ts","./src/errors/invalid-client-id-error.ts","./src/errors/invalid-client-metadata-error.ts","./src/errors/invalid-dpop-key-binding-error.ts","./src/errors/invalid-dpop-proof-error.ts","./src/errors/invalid-grant-error.ts","./src/errors/invalid-invite-code-error.ts","./src/errors/invalid-parameters-error.ts","./src/errors/invalid-redirect-uri-error.ts","./src/errors/invalid-request-error.ts","./src/errors/invalid-scope-error.ts","./src/errors/invalid-token-error.ts","./src/errors/login-required-error.ts","./src/errors/oauth-error.ts","./src/errors/second-authentication-factor-required-error.ts","./src/errors/unauthorized-client-error.ts","./src/errors/use-dpop-nonce-error.ts","./src/errors/www-authenticate-error.ts","./src/lib/hcaptcha.ts","./src/lib/locale.ts","./src/lib/redis.ts","./src/lib/csp/index.ts","./src/lib/html/build-document.ts","./src/lib/html/escapers.ts","./src/lib/html/html.ts","./src/lib/html/index.ts","./src/lib/html/tags.ts","./src/lib/html/util.ts","./src/lib/http/accept.ts","./src/lib/http/context.ts","./src/lib/http/index.ts","./src/lib/http/method.ts","./src/lib/http/middleware.ts","./src/lib/http/parser.ts","./src/lib/http/path.ts","./src/lib/http/request.ts","./src/lib/http/response.ts","./src/lib/http/route.ts","./src/lib/http/router.ts","./src/lib/http/security-headers.ts","./src/lib/http/stream.ts","./src/lib/http/types.ts","./src/lib/http/url.ts","./src/lib/util/authorization-header.ts","./src/lib/util/cast.ts","./src/lib/util/crypto.ts","./src/lib/util/date.ts","./src/lib/util/function.ts","./src/lib/util/hostname.ts","./src/lib/util/redirect-uri.ts","./src/lib/util/time.ts","./src/lib/util/type.ts","./src/lib/util/well-known.ts","./src/metadata/build-metadata.ts","./src/oidc/sub.ts","./src/output/backend-data.ts","./src/output/build-authorize-data.ts","./src/output/build-customization-data.ts","./src/output/build-error-data.ts","./src/output/build-error-payload.ts","./src/output/output-manager.ts","./src/output/send-authorize-redirect.ts","./src/output/send-web-page.ts","./src/replay/replay-manager.ts","./src/replay/replay-store-memory.ts","./src/replay/replay-store-redis.ts","./src/replay/replay-store.ts","./src/request/code.ts","./src/request/request-data.ts","./src/request/request-id.ts","./src/request/request-info.ts","./src/request/request-manager.ts","./src/request/request-store-memory.ts","./src/request/request-store-redis.ts","./src/request/request-store.ts","./src/request/request-uri.ts","./src/signer/signed-token-payload.ts","./src/signer/signer.ts","./src/token/refresh-token.ts","./src/token/token-claims.ts","./src/token/token-data.ts","./src/token/token-id.ts","./src/token/token-manager.ts","./src/token/token-store.ts","./src/token/verify-token-claims.ts"],"version":"5.6.3"}

package/tsconfig.json

@@ -1,8 +1,4 @@
 {
   "include": [],
-  "references": [
-    { "path": "./tsconfig.frontend.json" },
-    { "path": "./tsconfig.backend.json" },
-    { "path": "./tsconfig.tools.json" }
-  ]
+  "references": [{ "path": "./tsconfig.backend.json" }]
 }

package/.linguirc

@@ -1,57 +0,0 @@
-{
-  "format": "po",
-  "sourceLocale": "en",
-  "locales": [
-    "en",
-    "an",
-    "ast",
-    "ca",
-    "da",
-    "de",
-    "el",
-    "en-GB",
-    "es",
-    "eu",
-    "fi",
-    "fr",
-    "ga",
-    "gl",
-    "hi",
-    "hu",
-    "ia",
-    "id",
-    "it",
-    "ja",
-    "km",
-    "ko",
-    "ne",
-    "nl",
-    "pl",
-    "pt-BR",
-    "ro",
-    "ru",
-    "sv",
-    "th",
-    "tr",
-    "uk",
-    "vi",
-    "zh-CN",
-    "zh-HK",
-    "zh-TW"
-  ],
-  "fallbackLocales": {
-    "default": "en"
-  },
-  "catalogs": [
-    {
-      "path": "<rootDir>/src/assets/app/locales/{locale}/messages",
-      "include": [
-        "<rootDir>/src/assets/app"
-      ],
-      "exclude": [
-        "**/dist/**",
-        "**/node_modules/**"
-      ]
-    }
-  ]
-}

package/dist/account/sign-up-data.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"sign-up-data.d.ts","sourceRoot":"","sources":["../../src/account/sign-up-data.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAA;AAIvB,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;EAIlB,CAAA;AAEX,MAAM,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,gBAAgB,CAAC,CAAA"}

package/dist/account/sign-up-data.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"sign-up-data.js","sourceRoot":"","sources":["../../src/account/sign-up-data.ts"],"names":[],"mappings":";;;AACA,oDAAwD;AACxD,yDAA4D;AAE/C,QAAA,gBAAgB,GAAG,0CAAuB;KACpD,MAAM,CAAC;IACN,aAAa,EAAE,iCAAmB,CAAC,QAAQ,EAAE;CAC9C,CAAC;KACD,MAAM,EAAE,CAAA"}