Security · Nuxt OG Image · Nuxt SEO

[NuxtSEO](https://nuxtseo.com/ "Home")

- [Modules](https://nuxtseo.com/docs/nuxt-seo/getting-started/introduction)
- [Tools](https://nuxtseo.com/tools)
- [Pro](https://nuxtseo.com/pro)
- [Learn SEO](https://nuxtseo.com/learn-seo/nuxt) [Releases](https://nuxtseo.com/releases)

[1.4K](https://github.com/harlan-zw/nuxt-seo)

[Nuxt SEO on GitHub](https://github.com/harlan-zw/nuxt-seo)

**OG Image v6** is here! Looking for an older version? [View v5 docs](https://nuxtseo.com/docs/og-image/v5/getting-started/introduction).

[User Guides](https://nuxtseo.com/docs/og-image/getting-started/introduction)

[API](https://nuxtseo.com/docs/og-image/api/define-og-image)

[Releases](https://nuxtseo.com/docs/og-image/releases/v6)

OG Image

- [Switch to OG Image](https://nuxtseo.com/docs/og-image/getting-started/introduction)
- [Switch to Nuxt SEO](https://nuxtseo.com/docs/nuxt-seo/getting-started/introduction)
- [Switch to Robots](https://nuxtseo.com/docs/robots/getting-started/introduction)
- [Switch to Sitemap](https://nuxtseo.com/docs/sitemap/getting-started/introduction)
- [Switch to Schema.org](https://nuxtseo.com/docs/schema-org/getting-started/introduction)
- [Switch to Link Checker](https://nuxtseo.com/docs/link-checker/getting-started/introduction)
- [Switch to SEO Utils](https://nuxtseo.com/docs/seo-utils/getting-started/introduction)
- [Switch to Site Config](https://nuxtseo.com/docs/site-config/getting-started/introduction)
- [Switch to Skew Protection](https://nuxtseo.com/docs/skew-protection/getting-started/introduction)
- [Switch to AI Ready](https://nuxtseo.com/docs/ai-ready/getting-started/introduction)

Search…```k`` /`

v6 (latest)

- Playgrounds
- [Discord Support](https://discord.com/invite/275MBUBvgP)

### Getting Started

- [Introduction](https://nuxtseo.com/docs/og-image/getting-started/introduction)
- [Installation](https://nuxtseo.com/docs/og-image/getting-started/installation)
- [Troubleshooting](https://nuxtseo.com/docs/og-image/getting-started/troubleshooting)
- [Tutorial: Your first OG Image](https://nuxtseo.com/docs/og-image/getting-started/getting-familiar-with-nuxt-og-image)

### Core Concepts

- [Zero Runtime](https://nuxtseo.com/docs/og-image/guides/zero-runtime)
- [WhatsApp & Multiple Images](https://nuxtseo.com/docs/og-image/guides/whatsapp)
- [Performance](https://nuxtseo.com/docs/og-image/guides/performance)
- [CLI](https://nuxtseo.com/docs/og-image/guides/cli)
- [Security](https://nuxtseo.com/docs/og-image/guides/security)
- [Cloudflare](https://nuxtseo.com/docs/og-image/guides/cloudflare)
- [Route Rules](https://nuxtseo.com/docs/og-image/guides/route-rules)
- [Caching Images](https://nuxtseo.com/docs/og-image/guides/cache)
- [JPEGs](https://nuxtseo.com/docs/og-image/guides/jpegs)
- [Custom Fonts](https://nuxtseo.com/docs/og-image/guides/custom-fonts)
- [Non-English Locales](https://nuxtseo.com/docs/og-image/guides/non-english-locales)
- [Emojis](https://nuxtseo.com/docs/og-image/guides/emojis)
- [Icons and Images](https://nuxtseo.com/docs/og-image/guides/icons-and-images)
- [Styling](https://nuxtseo.com/docs/og-image/guides/styling)
- [Community Templates](https://nuxtseo.com/docs/og-image/guides/community-templates)
- [Error pages](https://nuxtseo.com/docs/og-image/guides/error-pages)

### Overview

- [Overview](https://nuxtseo.com/docs/og-image/renderers)
- [Takumi Renderer](https://nuxtseo.com/docs/og-image/renderers/takumi)
- [Satori Renderer](https://nuxtseo.com/docs/og-image/renderers/satori)
- [Browser Renderer](https://nuxtseo.com/docs/og-image/renderers/browser)

### Integrations

- [Nuxt Content](https://nuxtseo.com/docs/og-image/integrations/content)
- [Nuxt Color Mode](https://nuxtseo.com/docs/og-image/integrations/color-mode)
- [Nuxt I18n](https://nuxtseo.com/docs/og-image/integrations/i18n)

Core Concepts

# Security

[Copy for LLMs](https://nuxtseo.com/docs/og-image/guides/security.md)

Nuxt OG Image ships with secure defaults. Image dimensions are clamped, renders are time limited, internal network requests are blocked, and user provided props are sanitized. No configuration is needed for these protections.

The primary security concern with runtime OG image generation is **denial of service**: without protection, anyone can craft arbitrary image generation requests to your `/_og/d/` endpoint, consuming server CPU and memory. URL signing prevents this by ensuring only your application can generate valid image URLs.

For full protection, we recommend combining URL signing with a **web application firewall** (WAF) or rate limiting on the `/_og/` path prefix. Services like [Cloudflare](https://cloudflare.com), AWS WAF, or your hosting provider's built-in rate limiting can add an additional layer of defense.

.env

```
NUXT_OG_IMAGE_SECRET=<your-secret>
```

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    security: {
      strict: true,
    }
  }
})
```

The secret is automatically picked up from the `NUXT_OG_IMAGE_SECRET` environment variable.

## [Strict Mode](#strict-mode)

Enabling `strict` mode applies all recommended security defaults in a single flag:

- **URL signing required**: `secret` must be set (rejects unsigned runtime requests with `403`)
- **Inline HTML disabled**: The deprecated `html` option is stripped entirely, preventing SSRF via inline HTML injection
- **Query string size limit**: `maxQueryParamSize` defaults to `2048` characters (instead of no limit)
- **Origin restriction**: `restrictRuntimeImagesToOrigin` defaults to `true`, locking runtime generation to your site config URL host

Any of these can still be overridden explicitly. Strict mode only changes the defaults.

The build will fail if `strict` is enabled without a `secret`. Generate one with:

```
npx nuxt-og-image generate-secret
```

## [URL Signing](#url-signing)

When a signing secret is configured, every OG image URL includes a cryptographic signature in the path. The server verifies this signature before rendering, rejecting any URL that has been tampered with or crafted manually.

This prevents unauthorized image generation requests that would otherwise consume server resources.

### [Setup](#setup)

1. Generate a secret:

```
npx nuxt-og-image generate-secret
```

1. Set the environment variable:

.env

```
NUXT_OG_IMAGE_SECRET=<your-secret>
```

Alternatively, you can set the secret directly in your nuxt config:

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    security: {
      secret: 'your-secret',
    }
  }
})
```

### [How It Works](#how-it-works)

When a secret is configured:

- `defineOgImage()` appends a signature to the URL path: `/_og/d/w_1200,h_600,s_abc123def456.png`
- The server extracts and verifies the signature before processing the request
- Requests with missing or invalid signatures receive a `403` response
- All query parameter overrides are ignored (the signed path is the single source of truth)

The signature is deterministic: the same options with the same secret always produce the same URL. This means URLs are stable across server restarts and deployments as long as the secret does not change.

### [Defense in Depth](#defense-in-depth)

URL signing works alongside the other security options (`maxDimension`, `maxQueryParamSize`, `renderTimeout`, `restrictRuntimeImagesToOrigin`) which continue to apply as defense-in-depth. When signing is active, query parameter overrides are ignored but the query string size limit still applies to reduce parsing overhead.

Dev mode and prerendering bypass signature verification. Signing only applies to runtime requests in production.

## [Prerender Your Images](#prerender-your-images)

The most effective security measure is to **prerender your OG images at build time** using [Zero Runtime mode](https://nuxtseo.com/docs/og-image/guides/zero-runtime). Prerendered images are served as static files with no runtime rendering code in your production build.

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    zeroRuntime: true
  }
})
```

When zero runtime is enabled:

- No server-side rendering code is included in your production build
- Images are generated once at build time and served as static assets
- The `/_og` endpoint is not available at runtime

If your OG images don't need to change dynamically after deployment, this is the recommended approach.

For sites that need a mix of static and dynamic images, you can prerender specific routes while keeping runtime generation available for others. See the [Zero Runtime guide](https://nuxtseo.com/docs/og-image/guides/zero-runtime) for configuration details.

## [Dimension and Render Limits](#dimension-and-render-limits)

Every request has its `width` and `height` clamped to `maxDimension` (default `2048` pixels). The Takumi renderer's `devicePixelRatio` is capped to `maxDpr` (default `2`).

If a render exceeds `renderTimeout` (default `15000ms`), it is aborted and the server returns a `408` status.

These are all enabled by default. You only need to configure them if you want different limits.

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    security: {
      maxDimension: 2048,
      maxDpr: 2,
      renderTimeout: 15000,
    }
  }
})
```

## [Query String Size Limit](#query-string-size-limit)

OG image options can be passed via query parameters when URL signing is not enabled. You can set `maxQueryParamSize` to reject requests with oversized query strings.

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    security: {
      maxQueryParamSize: 2048, // characters
    }
  }
})
```

Requests exceeding this limit receive a `400` response.

When URL signing is active, query parameter overrides are ignored, but this size limit still applies to reduce request parsing overhead.

If you find yourself passing large amounts of data through query parameters (titles, descriptions, full text), consider loading that data inside your OG image component instead. See the [Performance guide](https://nuxtseo.com/docs/og-image/guides/performance#reduce-url-size) for the recommended pattern.

## [Restrict Runtime Images to Origin](#restrict-runtime-images-to-origin)

When runtime image generation is enabled, anyone who knows the `/_og` endpoint pattern can request an image directly. The `restrictRuntimeImagesToOrigin` option limits runtime generation to requests whose `Host` header matches your configured site URL.

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    security: {
      restrictRuntimeImagesToOrigin: true,
    }
  }
})
```

### [How It Works](#how-it-works-1)

The module reads the `Host` header from each runtime request using h3's `getRequestHost` (with `X-Forwarded-Host` support for reverse proxies) and compares it against the host from your [Nuxt Site Config](https://nuxtseo.com/docs/site-config/getting-started/introduction) `url`. If the hosts don't match, the request receives a `403` response.

Because the `Host` header is mandatory in HTTP/1.1, this check works with all clients including social media crawlers. No `Origin` or `Referer` header is required.

### [Allowing Additional Origins](#allowing-additional-origins)

To allow extra origins (e.g. a CDN or preview deployment), pass an array. Your site config origin is always included automatically.

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    security: {
      restrictRuntimeImagesToOrigin: ['https://cdn.example.com', 'https://preview.example.com'],
    }
  }
})
```

This option is **disabled by default** to avoid surprises for sites behind non-standard proxy setups. If your reverse proxy forwards the correct `Host` or `X-Forwarded-Host` header, you can safely enable it.

Prerendering and dev mode bypass the host check entirely.

## [Debug Mode Warning](#debug-mode-warning)

Enabling `ogImage.debug` in production exposes the `/_og/debug.json` endpoint. The module will log a warning at build time if debug is enabled outside of dev mode. Make sure to disable it before deploying.

nuxt.config.ts

```
export default defineNuxtConfig({
  ogImage: {
    debug: false, // never enable in production
  }
})
```

[Edit this page](https://github.com/nuxt-modules/og-image/edit/main/docs/content/3.guides/13.security.md)

[Markdown For LLMs](https://nuxtseo.com/docs/og-image/guides/security.md)

Did this page help you?

[CLI Use the nuxt-og-image CLI to scaffold, manage, and migrate OG image components.](https://nuxtseo.com/docs/og-image/guides/cli) [Cloudflare Deploy Nuxt OG Image to Cloudflare Workers or Pages.](https://nuxtseo.com/docs/og-image/guides/cloudflare)

On this page

- [Strict Mode](#strict-mode)
- [URL Signing](#url-signing)
- [Prerender Your Images](#prerender-your-images)
- [Dimension and Render Limits](#dimension-and-render-limits)
- [Query String Size Limit](#query-string-size-limit)
- [Restrict Runtime Images to Origin](#restrict-runtime-images-to-origin)
- [Debug Mode Warning](#debug-mode-warning)

[GitHub](https://github.com/harlan-zw/nuxt-seo) [ Discord](https://discord.com/invite/275MBUBvgP)

### [NuxtSEO](https://nuxtseo.com/ "Home")

- [Getting Started](https://nuxtseo.com/docs/nuxt-seo/getting-started/introduction)
- [MCP](https://nuxtseo.com/docs/nuxt-seo/guides/mcp)

Modules

- [Robots](https://nuxtseo.com/docs/robots/getting-started/introduction)
- [Sitemap](https://nuxtseo.com/docs/sitemap/getting-started/introduction)
- [OG Image](https://nuxtseo.com/docs/og-image/getting-started/introduction)
- [Schema.org](https://nuxtseo.com/docs/schema-org/getting-started/introduction)
- [Link Checker](https://nuxtseo.com/docs/link-checker/getting-started/introduction)
- [SEO Utils](https://nuxtseo.com/docs/seo-utils/getting-started/introduction)
- [Site Config](https://nuxtseo.com/docs/site-config/getting-started/introduction)
- [Skew Protection](https://nuxtseo.com/docs/skew-protection/getting-started/introduction)
- [AI Ready](https://nuxtseo.com/docs/ai-ready/getting-started/introduction)

### [NuxtSEO Pro](https://nuxtseo.com/pro "Home")

- [Getting Started](https://nuxtseo.com/pro)
- [Dashboard](https://nuxtseo.com/pro/dashboard)
- [Pro MCP](https://nuxtseo.com/docs/nuxt-seo-pro/mcp/installation)

### [Learn SEO](https://nuxtseo.com/learn-seo "Learn SEO")

Nuxt

- [Mastering Meta](https://nuxtseo.com/learn-seo/nuxt/mastering-meta)
- [Controlling Crawlers](https://nuxtseo.com/learn-seo/nuxt/controlling-crawlers)
- [Launch & Listen](https://nuxtseo.com/learn-seo/nuxt/launch-and-listen)
- [Routes & Rendering](https://nuxtseo.com/learn-seo/nuxt/routes-and-rendering)
- [Staying Secure](https://nuxtseo.com/learn-seo/nuxt/routes-and-rendering/security)

Vue

- [Vue SEO Guide](https://nuxtseo.com/learn-seo/vue)
- [Mastering Meta](https://nuxtseo.com/learn-seo/vue/mastering-meta)
- [Controlling Crawlers](https://nuxtseo.com/learn-seo/vue/controlling-crawlers)
- [SPA SEO](https://nuxtseo.com/learn-seo/vue/spa)
- [SSR Frameworks](https://nuxtseo.com/learn-seo/vue/ssr-frameworks)
- [SEO Checklist](https://nuxtseo.com/learn-seo/checklist)
- [Pre-Launch Warmup](https://nuxtseo.com/learn-seo/pre-launch-warmup)
- [Backlinks & Authority](https://nuxtseo.com/learn-seo/backlinks)

### [Tools](https://nuxtseo.com/tools "SEO Tools")

- [Social Share Debugger](https://nuxtseo.com/tools/social-share-debugger)
- [Robots.txt Generator](https://nuxtseo.com/tools/robots-txt-generator)
- [Meta Tag Checker](https://nuxtseo.com/tools/meta-tag-checker)
- [HTML to Markdown](https://nuxtseo.com/tools/html-to-markdown)
- [XML Sitemap Validator](https://nuxtseo.com/tools/xml-sitemap-validator)
- [Schema.org Validator](https://nuxtseo.com/tools/schema-validator)
- [Keyword Research Pro](https://nuxtseo.com/tools/keyword-research)
- [SERP Analyzer Pro](https://nuxtseo.com/tools/serp-analyzer)
- [Domain Rankings Pro](https://nuxtseo.com/tools/domain-rankings)

Copyright © 2023-2026 Harlan Wilton - [MIT License](https://github.com/harlan-zw/nuxt-seo/blob/main/license) · [mdream](https://mdream.dev)