Open-Source Security Intelligence

Know every vulnerability
before it knows you.

DevGuard continuously monitors your dependencies and alerts you when CVEs like this one affect your stack — with real-time threat intelligence built for developers.

Checkout DevGuard View on GitHub

GHSA-g5xx-pwrp-g3fv

MediumCVSS 5.3 / 10

Published Mar 12, 2026·Last modified Mar 14, 2026

Affected Components(0)

No affected components available

Description

Summary

useHeadSafe() can be bypassed to inject arbitrary HTML attributes, including event handlers, into SSR-rendered <head> tags. This is the composable that Nuxt docs recommend for safely handling user-generated content.

Details

XSS via data-* attribute name injection

The acceptDataAttrs function (safe.ts, line 16-20) allows any property key starting with data- through to the final HTML. It only checks the prefix, not whether the key contains spaces or other characters that break HTML attribute parsing.

function acceptDataAttrs(value: Record<string, string>) {
  return Object.fromEntries(
    Object.entries(value || {}).filter(([key]) => key === 'id' || key.startsWith('data-')),
  )
}

This result gets merged into every tag's props at line 114:

tag.props = { ...acceptDataAttrs(prev), ...next }

Then propsToString (propsToString.ts, line 26) interpolates property keys directly into the HTML string with no sanitization:

attrs += value === true ? ` ${key}` : ` ${key}="${encodeAttribute(value)}"`

A space in the key breaks out of the attribute name. Everything after the space becomes separate HTML attributes.

PoC

The most practical vector uses a link tag. <link rel="stylesheet"> fires onload once the stylesheet loads, giving reliable script execution:

useHeadSafe({
  link: [{
    rel: 'stylesheet',
    href: '/valid-stylesheet.css',
    'data-x onload=alert(document.domain) y': 'z'
  }]
})

SSR output:

<link data-x onload=alert(document.domain) y="z" rel="stylesheet" href="/valid-stylesheet.css">

The browser parses onload=alert(document.domain) as its own attribute. Once the stylesheet loads, the handler fires.

The same injection works on any tag type since acceptDataAttrs is applied to all of them at line 114. Here's the same thing on a meta tag (the injected attributes render, though onclick doesn't fire on non-interactive <meta> elements):

useHeadSafe({
  meta: [{
    name: 'description',
    content: 'legitimate content',
    'data-x onclick=alert(document.domain) y': 'z'
  }]
})

Realistic scenario

A Nuxt app accepts SEO metadata from a CMS or user profile. The developer uses useHeadSafe() as the docs recommend. An attacker puts a data-* key with spaces and an event handler into their input. The payload renders into the HTML on every page load.

Suggested fix

For vulnerability 1, validate that attribute names only contain characters legal in HTML attributes:

const SAFE_ATTR_RE = /^[a-zA-Z][a-zA-Z0-9\-]*$/

function acceptDataAttrs(value: Record<string, string>) {
  return Object.fromEntries(
    Object.entries(value || {}).filter(
      ([key]) => (key === 'id' || key.startsWith('data-')) && SAFE_ATTR_RE.test(key)
    ),
  )
}

Risk Scores

Base Score

5.3

The vulnerability can be exploited over the network without needing physical access. It is easy for an attacker to exploit this vulnerability. An attacker does not need any special privileges or access rights.

Threat Intelligence

1.3

Limited exploitation activity has been observed. Close monitoring and planned remediation are recommended.

EPSS

0.26%

The exploit probability is very low. The vulnerability is unlikely to be exploited in the next 30 days.

Exploit

Not available

We did not find any exploit available. Neither in GitHub repositories nor in the Exploit-Database.

Related Vulnerabilities

Browse More

Medium severity

Scan your project

Continuously monitor your dependencies and get alerted when vulnerabilities like this one affect your stack.

Checkout DevGuard