nuxt-og-image 6.5.3 → 6.7.0

package/dist/devtools/pages/og-image/templates.vue

@@ -0,0 +1,150 @@
+<script lang="ts" setup>
+import { withQuery } from 'ufo'
+import { navigateTo } from '#imports'
+import { useOgImage } from '../../lib/og-image/og-image'
+
+const {
+  appComponents,
+  communityComponents,
+  activeComponentName,
+  src,
+  aspectRatio,
+  isLoading,
+  patchOptions,
+} = useOgImage()
+
+async function selectTemplate(componentName: string) {
+  patchOptions({ component: componentName })
+  await navigateTo('/')
+}
+</script>
+
+<template>
+  <div class="templates-page animate-fade-up">
+    <!-- Loading state -->
+    <div v-if="isLoading" class="loading-container">
+      <div class="loading-spinner" />
+      <p class="loading-text">
+        Loading templates&#8230;
+      </p>
+    </div>
+
+    <!-- Content -->
+    <div v-else class="templates-content stagger-children">
+      <!-- Your Templates -->
+      <DevtoolsSection v-if="appComponents.length" icon="carbon:app" text="Your Templates">
+        <template #description>
+          Custom OG Image components in your project
+        </template>
+        <div class="template-grid">
+          <button
+            v-for="name in appComponents"
+            :key="name.pascalName"
+            class="template-item"
+            @click="selectTemplate(name.pascalName)"
+          >
+            <TemplateComponentPreview
+              :component="name"
+              :src="withQuery(src, { component: name.pascalName })"
+              :aspect-ratio="aspectRatio"
+              :active="name.pascalName === activeComponentName"
+            />
+          </button>
+        </div>
+      </DevtoolsSection>
+
+      <!-- Community Templates -->
+      <DevtoolsSection icon="carbon:user-multiple" text="Community Templates">
+        <template #description>
+          Pre-built templates you can use or eject
+        </template>
+        <div class="template-grid">
+          <button
+            v-for="name in communityComponents"
+            :key="name.pascalName"
+            class="template-item"
+            @click="selectTemplate(name.pascalName)"
+          >
+            <TemplateComponentPreview
+              :component="name"
+              :src="withQuery(src, { component: name.pascalName })"
+              :aspect-ratio="aspectRatio"
+              :active="name.pascalName === activeComponentName"
+            />
+          </button>
+        </div>
+      </DevtoolsSection>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.templates-page {
+  padding-bottom: 2rem;
+}
+
+.loading-container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  min-height: 300px;
+  gap: 1rem;
+}
+
+.loading-spinner {
+  width: 2.5rem;
+  height: 2.5rem;
+  border: 2px solid var(--color-border);
+  border-top-color: var(--seo-green);
+  border-radius: 50%;
+  animation: spin 0.8s linear infinite;
+}
+
+@keyframes spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.loading-text {
+  font-size: 0.875rem;
+  color: var(--color-text-muted);
+}
+
+.templates-content {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.template-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
+  gap: 1rem;
+}
+
+@media (min-width: 640px) {
+  .template-grid {
+    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
+    gap: 1.25rem;
+  }
+}
+
+.template-item {
+  padding: 0;
+  background: none;
+  border: none;
+  text-align: left;
+  cursor: pointer;
+  transition: transform 150ms cubic-bezier(0.22, 1, 0.36, 1);
+}
+
+.template-item:hover {
+  transform: translateY(-2px);
+}
+
+.template-item:active {
+  transform: translateY(0);
+}
+</style>

package/dist/devtools/pages/og-image.vue

@@ -0,0 +1,184 @@
+<script lang="ts" setup>
+import type { OgImageRuntimeConfig } from '../lib/og-image/runtime-types'
+import type { GlobalDebugResponse, PathDebugResponse } from '../lib/og-image/types'
+import defu from 'defu'
+import { appFetch } from 'nuxtseo-layer-devtools/composables/rpc'
+import { loadShiki } from 'nuxtseo-layer-devtools/composables/shiki'
+import { path, productionUrl, query, refreshTime } from 'nuxtseo-layer-devtools/composables/state'
+import { computed, provide, useAsyncData, useNuxtApp, useRoute, watch } from '#imports'
+import AddComponentDialog from '../components/og-image/AddComponentDialog.vue'
+import CreateOgImageDialog from '../components/og-image/CreateOgImageDialog.vue'
+import RendererSelectModal from '../components/og-image/RendererSelectModal.vue'
+import { GlobalDebugKey, PathDebugKey, PathDebugStatusKey, RefetchPathDebugKey } from '../lib/og-image/keys'
+import { useOgImage } from '../lib/og-image/og-image'
+import { encodeOgImageParams } from '../lib/og-image/shared/urlEncoding'
+import { ogImageKey, options, optionsOverrides } from '../lib/og-image/util/logic'
+
+const RE_IMAGE_EXT = /\.(png|jpeg|jpg|webp)$/
+
+await loadShiki()
+
+const nuxtApp = useNuxtApp()
+nuxtApp.payload.data = nuxtApp.payload.data || {}
+
+// @ts-expect-error untyped
+const { data: globalDebug } = useAsyncData<GlobalDebugResponse>('og-image-global-debug', () => {
+  if (!appFetch.value)
+    return { runtimeConfig: {} as OgImageRuntimeConfig, componentNames: [] }
+  return appFetch.value('/_og/debug.json')
+}, {
+  watch: [appFetch, refreshTime],
+  default: () => ({ runtimeConfig: {} as OgImageRuntimeConfig, componentNames: [] }),
+})
+
+// Read og:image URL from host document — already has correct component/params from defineOgImage
+function getHostOgImageDebugUrl(): string | undefined {
+  try {
+    const doc = window.parent?.document
+    if (!doc)
+      return
+    const meta = doc.querySelector('meta[property="og:image"]') || doc.querySelector('meta[name="twitter:image"]')
+    const content = meta?.getAttribute('content')
+    if (!content?.includes('/_og/'))
+      return
+    return new URL(content).pathname.replace(RE_IMAGE_EXT, '.json')
+  }
+  catch {
+    // Cross-origin parent documents cannot be inspected; fall back to route options.
+  }
+}
+
+const { data: pathDebug, refresh: refreshPathDebug, status: pathDebugStatus } = useAsyncData<PathDebugResponse>('og-image-path-debug', async () => {
+  if (!appFetch.value)
+    return { extract: { options: [], socialPreview: { root: {}, images: [] } } }
+  let url = getHostOgImageDebugUrl()
+  if (!url) {
+    const params = defu(
+      { key: ogImageKey.value || 'og', _path: path.value, _query: query.value },
+      optionsOverrides.value,
+      options.value,
+    )
+    const encoded = encodeOgImageParams(params)
+    url = `/_og/d/${encoded || 'default'}.json`
+  }
+  return (appFetch.value(url) as Promise<PathDebugResponse>).catch((err: any): PathDebugResponse => ({
+    extract: { options: [], socialPreview: { root: {}, images: [] } },
+    fetchError: {
+      statusCode: err?.data?.statusCode || err?.statusCode,
+      message: err?.data?.stack?.[0] || err?.data?.message || err?.message || 'Unknown error',
+      stack: err?.data?.stack,
+    },
+  }))
+}, {
+  watch: [appFetch, path, refreshTime, ogImageKey],
+  default: () => ({ extract: { options: [], socialPreview: { root: {}, images: [] } } }),
+})
+
+// Sync production URL from site config for production preview toggle
+watch(globalDebug, (val) => {
+  // @ts-expect-error globalDebug type doesn't include siteConfigUrl
+  if (val?.siteConfigUrl)
+    // @ts-expect-error globalDebug type doesn't include siteConfigUrl
+    productionUrl.value = val.siteConfigUrl
+}, { immediate: true })
+
+// @ts-expect-error untyped
+provide(GlobalDebugKey, globalDebug)
+provide(PathDebugKey, pathDebug)
+provide(PathDebugStatusKey, pathDebugStatus)
+provide(RefetchPathDebugKey, refreshPathDebug)
+
+const {
+  isDebugLoading,
+  error,
+  refreshSources,
+  resetProps,
+} = useOgImage()
+
+await resetProps(false)
+
+const route = useRoute()
+const currentTab = computed(() => {
+  const p = route.path
+  if (p === '/og-image/templates')
+    return 'templates'
+  if (p === '/og-image/debug')
+    return 'debug'
+  if (p === '/og-image/docs')
+    return 'docs'
+  return 'design'
+})
+
+const navItems = [
+  { value: 'design', to: '/og-image', icon: 'carbon:brush-freehand', label: 'Design', devOnly: false },
+  { value: 'templates', to: '/og-image/templates', icon: 'carbon:image', label: 'Templates', devOnly: false },
+  { value: 'debug', to: '/og-image/debug', icon: 'carbon:debug', label: 'Debug', devOnly: true },
+  { value: 'docs', to: '/og-image/docs', icon: 'carbon:book', label: 'Docs', devOnly: false },
+]
+
+const runtimeVersion = computed(() => {
+  // @ts-expect-error untyped
+  return globalDebug.value?.runtimeConfig?.version || 'unknown'
+})
+</script>
+
+<template>
+  <DevtoolsLayout
+    module-name="nuxt-og-image"
+    title="OG Image"
+    icon="carbon:image-search"
+    :version="runtimeVersion"
+    :nav-items="navItems"
+    github-url="https://github.com/nuxt-modules/og-image"
+    :loading="isDebugLoading || !!error"
+    :active-tab="currentTab"
+    @refresh="refreshSources"
+  >
+    <AddComponentDialog />
+    <CreateOgImageDialog />
+    <RendererSelectModal />
+    <NuxtPage />
+  </DevtoolsLayout>
+</template>
+
+<style>
+/* Textarea */
+textarea {
+  background: var(--color-surface-sunken);
+  border: 1px solid var(--color-border);
+  border-radius: var(--radius-md);
+}
+
+textarea:focus-visible {
+  border-color: var(--seo-green);
+  outline: none;
+}
+
+/* JSON Editor theme */
+:root {
+  --jse-theme-color: var(--color-surface-elevated) !important;
+  --jse-text-color-inverse: var(--color-text-muted) !important;
+  --jse-theme-color-highlight: var(--color-surface-sunken) !important;
+  --jse-panel-background: var(--color-surface-elevated) !important;
+  --jse-background-color: var(--jse-panel-background) !important;
+  --jse-error-color: oklch(65% 0.2 25 / 0.3) !important;
+  --jse-main-border: none !important;
+}
+
+.dark,
+.jse-theme-dark {
+  --jse-panel-background: var(--color-neutral-900) !important;
+  --jse-theme-color: var(--color-neutral-900) !important;
+  --jse-text-color-inverse: var(--color-neutral-300) !important;
+  --jse-main-border: none !important;
+}
+
+.jse-main {
+  min-height: 1em !important;
+}
+
+.jse-contents {
+  border-width: 0 !important;
+  border-radius: var(--radius-md) !important;
+}
+</style>

package/dist/module.cjs

@@ -1,5 +1,6 @@
 'use strict';
 
+require('node:crypto');
 require('node:fs');
 require('node:fs/promises');
 require('node:url');
@@ -10,13 +11,11 @@ require('ohash');
 require('pathe');
 require('pkg-types');
 require('std-env');
-const module$1 = require('./shared/nuxt-og-image.CfTPCtaS.cjs');
+const module$1 = require('./shared/nuxt-og-image.yDJBWXBt.cjs');
+require('./shared/nuxt-og-image.RI9DgjgV.cjs');
 require('nuxtseo-shared/kit');
 require('../dist/runtime/logger.js');
-require('node:crypto');
 require('oxc-walker');
-require('chrome-launcher');
-require('nypm');
 require('nuxtseo-shared/devtools');
 require('unstorage');
 require('unstorage/drivers/fs-lite');
@@ -30,9 +29,10 @@ require('ofetch');
 require('ultrahtml');
 require('../dist/runtime/server/og-image/core/transforms/emojis/emoji-utils.js');
 require('exsolve');
-require('./shared/nuxt-og-image.CMYbz66P.cjs');
 require('magicast');
 require('magicast/helpers');
+require('nypm');
+require('chrome-launcher');
 
 
 

package/dist/module.d.cts

@@ -186,12 +186,14 @@ interface ModuleOptions {
          * keyed hash signature and the handler rejects requests with missing or
          * invalid signatures.
          *
-         * Must be a stable string across deployments. Generate one with:
+         * Leave unset to auto-generate a per-build secret (signing on by default).
+         * Set an explicit, stable string for rolling or multi-instance deploys, or
+         * `false` to disable signing entirely. Generate one with:
          * `npx nuxt-og-image generate-secret`
          *
-         * Required when `strict` is enabled.
+         * Required (explicitly) when `strict` is enabled.
          */
-        secret?: string;
+        secret?: string | false;
         /**
          * Enable strict security mode. When enabled:
          * - `secret` is required (URL signing)

package/dist/module.d.mts

@@ -186,12 +186,14 @@ interface ModuleOptions {
          * keyed hash signature and the handler rejects requests with missing or
          * invalid signatures.
          *
-         * Must be a stable string across deployments. Generate one with:
+         * Leave unset to auto-generate a per-build secret (signing on by default).
+         * Set an explicit, stable string for rolling or multi-instance deploys, or
+         * `false` to disable signing entirely. Generate one with:
          * `npx nuxt-og-image generate-secret`
          *
-         * Required when `strict` is enabled.
+         * Required (explicitly) when `strict` is enabled.
          */
-        secret?: string;
+        secret?: string | false;
         /**
          * Enable strict security mode. When enabled:
          * - `secret` is required (URL signing)

package/dist/module.d.ts

@@ -186,12 +186,14 @@ interface ModuleOptions {
          * keyed hash signature and the handler rejects requests with missing or
          * invalid signatures.
          *
-         * Must be a stable string across deployments. Generate one with:
+         * Leave unset to auto-generate a per-build secret (signing on by default).
+         * Set an explicit, stable string for rolling or multi-instance deploys, or
+         * `false` to disable signing entirely. Generate one with:
          * `npx nuxt-og-image generate-secret`
          *
-         * Required when `strict` is enabled.
+         * Required (explicitly) when `strict` is enabled.
          */
-        secret?: string;
+        secret?: string | false;
         /**
          * Enable strict security mode. When enabled:
          * - `secret` is required (URL signing)

package/dist/module.json

@@ -4,7 +4,7 @@
     "nuxt": ">=3.16.0"
   },
   "configKey": "ogImage",
-  "version": "6.5.3",
+  "version": "6.7.0",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -1,3 +1,4 @@
+import 'node:crypto';
 import 'node:fs';
 import 'node:fs/promises';
 import 'node:url';
@@ -8,13 +9,11 @@ import 'ohash';
 import 'pathe';
 import 'pkg-types';
 import 'std-env';
-export { m as default } from './shared/nuxt-og-image.DdbTs-xp.mjs';
+export { m as default } from './shared/nuxt-og-image.CPSxZhVO.mjs';
+import './shared/nuxt-og-image.DM30kcDz.mjs';
 import 'nuxtseo-shared/kit';
 import '../dist/runtime/logger.js';
-import 'node:crypto';
 import 'oxc-walker';
-import 'chrome-launcher';
-import 'nypm';
 import 'nuxtseo-shared/devtools';
 import 'unstorage';
 import 'unstorage/drivers/fs-lite';
@@ -28,6 +27,7 @@ import 'ofetch';
 import 'ultrahtml';
 import '../dist/runtime/server/og-image/core/transforms/emojis/emoji-utils.js';
 import 'exsolve';
-import './shared/nuxt-og-image.CJa2KCie.mjs';
 import 'magicast';
 import 'magicast/helpers';
+import 'nypm';
+import 'chrome-launcher';

package/dist/runtime/server/og-image/bindings/font-assets/cloudflare.d.ts

@@ -1,3 +1,3 @@
 import type { H3Event } from 'h3';
 import type { FontConfig } from '../../../../types.js';
-export declare function resolve(event: H3Event, font: FontConfig): Promise<Buffer<ArrayBuffer>>;
+export declare function resolve(event: H3Event, font: FontConfig): Promise<Buffer<ArrayBufferLike>>;

package/dist/runtime/server/og-image/bindings/font-assets/cloudflare.js

@@ -1,14 +1,19 @@
 import { useRuntimeConfig } from "nitropack/runtime";
 import { withBase } from "ufo";
+import { getSiteConfig } from "#site-config/server/composables";
 import { getCloudflareAssets } from "../../../util/cloudflareAssets.js";
 import { fetchLocalAsset } from "../../../util/fetchLocalAsset.js";
 import { getFetchTimeout } from "../../../util/fetchTimeout.js";
 import { useOgImageRuntimeConfig } from "../../../utils.js";
+import { fetchSpecialFontUrl, isDataFontUrl, isExternalFontUrl } from "./external-url.js";
 export async function resolve(event, font) {
   const path = font.src || font.localPath;
+  const runtimeConfig = useOgImageRuntimeConfig();
+  const timeout = getFetchTimeout(runtimeConfig);
   const { app } = useRuntimeConfig();
   const fullPath = withBase(path, app.baseURL);
-  const timeout = getFetchTimeout(useOgImageRuntimeConfig());
+  if (path && (isDataFontUrl(path) || isExternalFontUrl(path)))
+    return fetchSpecialFontUrl(path, getSiteConfig(event).url, timeout);
   const ab = await fetchLocalAsset(event, fullPath, { fetchTimeout: timeout });
   if (ab)
     return Buffer.from(ab);

package/dist/runtime/server/og-image/bindings/font-assets/dev-prerender.js

@@ -4,8 +4,11 @@ import { useRuntimeConfig } from "nitropack/runtime";
 import { join } from "pathe";
 import { withBase } from "ufo";
 import { buildDir, rootDir } from "#og-image-virtual/build-dir.mjs";
+import { getSiteConfig } from "#site-config/server/composables";
 import { getFetchTimeout } from "../../../util/fetchTimeout.js";
+import { fetchWithRedirectValidation } from "../../../util/ssrf.js";
 import { useOgImageRuntimeConfig } from "../../../utils.js";
+import { fetchSpecialFontUrl, isDataFontUrl, isExternalFontUrl } from "./external-url.js";
 let fontUrlMapping;
 async function loadFontUrlMapping() {
   if (fontUrlMapping)
@@ -16,12 +19,15 @@ async function loadFontUrlMapping() {
 }
 export async function resolve(event, font) {
   const path = font.src || font.localPath;
-  const timeout = getFetchTimeout(useOgImageRuntimeConfig());
+  const runtimeConfig = useOgImageRuntimeConfig();
+  const timeout = getFetchTimeout(runtimeConfig);
   if (font.absolutePath) {
     const data = await readFile(font.absolutePath).catch(() => null);
     if (data?.length)
       return data;
   }
+  if (path && (isDataFontUrl(path) || isExternalFontUrl(path)))
+    return fetchSpecialFontUrl(path, getSiteConfig(event).url, timeout);
   if (import.meta.prerender) {
     if (path.startsWith("/_og-static-fonts/")) {
       const filename2 = path.slice("/_og-static-fonts/".length);
@@ -72,14 +78,15 @@ export async function resolve(event, font) {
   if (import.meta.dev) {
     const reqUrl = getRequestURL(event);
     const origin = `${reqUrl.protocol}//${reqUrl.host}`;
-    const url = new URL(withBase(path, app.baseURL), origin).href;
-    const res = await fetch(url, { signal: AbortSignal.timeout(timeout) }).catch(() => null);
-    if (res?.ok) {
-      return Buffer.from(await res.arrayBuffer());
+    const target = new URL(withBase(path, app.baseURL), origin);
+    const ab = await fetchWithRedirectValidation(target.href, { timeout, trustedHost: target.host }).catch(() => null);
+    if (ab) {
+      return Buffer.from(ab);
     }
   }
   const fullPath = withBase(path, app.baseURL);
-  const arrayBuffer = await event.$fetch(fullPath, {
+  const fetchArrayBuffer = event.$fetch;
+  const arrayBuffer = await fetchArrayBuffer(fullPath, {
     responseType: "arrayBuffer",
     timeout
   });

package/dist/runtime/server/og-image/bindings/font-assets/external-url.d.ts

@@ -0,0 +1,36 @@
+/** True for an inline `data:` font URI (no network — safe to decode directly). */
+export declare function isDataFontUrl(path: string): boolean;
+/**
+ * True when a font path carries its own authority (`//host`, `http://host`,
+ * `\\host`) or a non-http scheme — i.e. it would not resolve same-origin.
+ *
+ * Classification resolves the path against a sentinel origin through the WHATWG
+ * URL parser, so it sees exactly what `fetch` will: leading C0 controls/spaces,
+ * embedded tab/CR/LF, and backslash folding are all normalized first. This
+ * closes the bypass class where " //127.0.0.1" or " //169.254.169.254" looks
+ * relative to a naive scheme check yet resolves cross-origin (GHSA-q8hw-4fvp-9rwv).
+ * Check `isDataFontUrl` first — `data:` is non-http and would report true here.
+ */
+export declare function isExternalFontUrl(path: string): boolean;
+/**
+ * Resolve an authority-bearing font URL to the href to fetch, but only when it
+ * is same-origin with the configured site URL. Returns null otherwise.
+ *
+ * Runtime external font URLs are unsupported — `@nuxt/fonts` is the only
+ * supported way to load custom fonts, and it serves them same-origin. The single
+ * allowed exception is the site's own origin, gated on an explicitly configured
+ * site URL. Resolving against that origin also collapses canonicalization
+ * bypasses (a crafted " //127.0.0.1" resolves cross-origin → rejected).
+ */
+export declare function resolveSameOriginFontUrl(path: string, siteUrl: string | undefined): string | null;
+/**
+ * Fetch a `data:` or authority-bearing font URL. `data:` is decoded directly
+ * (no network). An external URL is fetched only when same-origin with the site
+ * URL, and always through the SSRF guard (scheme allowlist, private-network
+ * block, per-hop redirect re-validation) so the site's own host can't be used
+ * to relay into its internal network via an open redirect.
+ *
+ * Throws on an unsupported/blocked/unreachable URL so the caller falls back to a
+ * bundled font; blocked targets stay indistinguishable from missing fonts.
+ */
+export declare function fetchSpecialFontUrl(path: string, siteUrl: string | undefined, timeout: number): Promise<Buffer>;

package/dist/runtime/server/og-image/bindings/font-assets/external-url.js

@@ -0,0 +1,47 @@
+import { fetchWithRedirectValidation } from "../../../util/ssrf.js";
+const SENTINEL_ORIGIN = "http://font-asset.invalid/";
+const SENTINEL_HOST = "font-asset.invalid";
+export function isDataFontUrl(path) {
+  return path.trimStart().toLowerCase().startsWith("data:");
+}
+export function isExternalFontUrl(path) {
+  let resolved;
+  try {
+    resolved = new URL(path, SENTINEL_ORIGIN);
+  } catch {
+    return true;
+  }
+  return resolved.protocol !== "http:" || resolved.host !== SENTINEL_HOST;
+}
+export function resolveSameOriginFontUrl(path, siteUrl) {
+  if (!siteUrl)
+    return null;
+  let siteOrigin;
+  try {
+    siteOrigin = new URL(siteUrl).origin;
+  } catch {
+    return null;
+  }
+  let target;
+  try {
+    target = new URL(path, siteOrigin);
+  } catch {
+    return null;
+  }
+  return target.origin === siteOrigin ? target.href : null;
+}
+export async function fetchSpecialFontUrl(path, siteUrl, timeout) {
+  if (isDataFontUrl(path)) {
+    const res = await fetch(path.trimStart(), { signal: AbortSignal.timeout(timeout) }).catch(() => null);
+    if (res?.ok)
+      return Buffer.from(await res.arrayBuffer());
+    throw new Error("[Nuxt OG Image] Invalid data: font URL.");
+  }
+  const href = resolveSameOriginFontUrl(path, siteUrl);
+  if (!href)
+    throw new Error("[Nuxt OG Image] External font URLs are not supported. Load custom fonts via @nuxt/fonts.");
+  const ab = await fetchWithRedirectValidation(href, { timeout });
+  if (!ab)
+    throw new Error("[Nuxt OG Image] Font URL blocked or unreachable.");
+  return Buffer.from(ab);
+}

package/dist/runtime/server/og-image/bindings/font-assets/node.d.ts

@@ -1,3 +1,3 @@
 import type { H3Event } from 'h3';
 import type { FontConfig } from '../../../../types.js';
-export declare function resolve(event: H3Event, font: FontConfig): Promise<Buffer<ArrayBuffer>>;
+export declare function resolve(event: H3Event, font: FontConfig): Promise<Buffer<ArrayBufferLike>>;

package/dist/runtime/server/og-image/bindings/font-assets/node.js

@@ -1,19 +1,26 @@
 import { useRuntimeConfig } from "nitropack/runtime";
 import { withBase } from "ufo";
-import { getNitroOrigin } from "#site-config/server/composables";
+import { getNitroOrigin, getSiteConfig } from "#site-config/server/composables";
 import { getFetchTimeout } from "../../../util/fetchTimeout.js";
+import { fetchWithRedirectValidation } from "../../../util/ssrf.js";
 import { useOgImageRuntimeConfig } from "../../../utils.js";
+import { fetchSpecialFontUrl, isDataFontUrl, isExternalFontUrl } from "./external-url.js";
 export async function resolve(event, font) {
   const path = font.src || font.localPath;
+  const runtimeConfig = useOgImageRuntimeConfig();
+  const timeout = getFetchTimeout(runtimeConfig);
   const { app } = useRuntimeConfig();
-  const fullPath = withBase(path, app.baseURL);
   const origin = getNitroOrigin(event);
-  const timeout = getFetchTimeout(useOgImageRuntimeConfig());
-  const res = await fetch(new URL(fullPath, origin).href, { signal: AbortSignal.timeout(timeout) }).catch(() => null);
-  if (res?.ok) {
-    return Buffer.from(await res.arrayBuffer());
+  const fullPath = withBase(path, app.baseURL);
+  if (path && (isDataFontUrl(path) || isExternalFontUrl(path)))
+    return fetchSpecialFontUrl(path, getSiteConfig(event).url, timeout);
+  const target = new URL(fullPath, origin);
+  const ab = await fetchWithRedirectValidation(target.href, { timeout, trustedHost: target.host }).catch(() => null);
+  if (ab) {
+    return Buffer.from(ab);
   }
-  const arrayBuffer = await event.$fetch(fullPath, {
+  const fetchArrayBuffer = event.$fetch;
+  const arrayBuffer = await fetchArrayBuffer(fullPath, {
     responseType: "arrayBuffer",
     timeout
   });