Summary
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
, 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.
Details
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)>
PoC
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).
Impact
This creates a DOM-based Cross-Site Scripting (XSS) vulnerability despite enabling a security option (escapeParameterHtml) .
Summary
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
, 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.
Details
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)>
PoC
In your Vue I18n configuration:
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).
Impact
This creates a DOM-based Cross-Site Scripting (XSS) vulnerability despite enabling a security option (escapeParameterHtml) .