The escapeParameterHtml: true option in Vue I18n is designed to protect against HTML/script injection by escaping interpolated parameters. However, this setting fails to prevent execution of certain tag-based payloads, such as <img src=x onerror=...>
, if the interpolated value is inserted inside an HTML context using v-html.
This may lead to a DOM-based XSS vulnerability, even when using escapeParameterHtml: true, if a translation string includes minor HTML and is rendered via v-html.
When escapeParameterHtml: true is enabled, it correctly escapes common injection points.
However, it does not sanitize entire attribute contexts, which can be used as XSS vectors via:
<img src=x onerror=alert(1)>
In your Vue I18n configuration:
const i18n = createI18n({
escapeParameterHtml: true,
messages: {
en: {
vulnerable: 'Caution: <img src=x onerror="{payload}">'
}
}
});
Use this interpolated payload:
const payload = '<script>alert("xss")</script>';
Render the translation using v-html (even not using v-html):
<p v-html="$t('vulnerable', { payload })"></p>
Expected: escaped content should render as text, not execute.
Actual: script executes in some environments (or the payload is partially parsed as HTML).
This creates a DOM-based Cross-Site Scripting (XSS) vulnerability despite enabling a security option (escapeParameterHtml) .
{ "severity": "MODERATE", "nvd_published_at": "2025-07-16T14:15:28Z", "github_reviewed": true, "github_reviewed_at": "2025-07-16T19:32:48Z", "cwe_ids": [ "CWE-79" ] }