🚨 [security] [app] Update vite 4.4.9 → 4.4.12 (patch)

[depfu]

---

🚨 Your current dependencies have known security vulnerabilities 🚨

This dependency update fixes known security vulnerabilities. Please see the details below and assess their impact carefully. We recommend to merge and deploy this as soon as possible!

---

Here is everything you need to know about this update. Please take a good look at what changed and the test results before merging this pull request.

What changed?

✳️ vite (4.4.9 → 4.4.12) · Repo · Changelog

Security Advisories 🚨

🚨 Vite XSS vulnerability in `server.transformIndexHtml` via URL payload

Summary

When Vite's HTML transformation is invoked manually via server.transformIndexHtml, the original request URL is passed in unmodified, and the html being transformed contains inline module scripts (<script type="module">...</script>), it is possible to inject arbitrary HTML into the transformed output by supplying a malicious URL query string to server.transformIndexHtml.

Impact

Only apps using appType: 'custom' and using the default Vite HTML middleware are affected. The HTML entry must also contain an inline script. The attack requires a user to click on a malicious URL while running the dev server. Restricted files aren't exposed to the attacker.

Patches

Fixed in vite@5.0.5, vite@4.5.1, vite@4.4.12

Details

Suppose index.html contains an inline module script:

<script type="module">
  // Inline script
</script>

This script is transformed into a proxy script like

<script type="module" src="/index.html?html-proxy&index=0.js"></script>

due to Vite's HTML plugin:

vite/packages/vite/src/node/plugins/html.ts

Lines 429 to 465 in 7fd7c6c

    <tbody>

    <tr class="border-0">
      <td id="L430" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="430"></td>
      <td id="LC430" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-s1">inlineModuleIndex</span><span class="pl-c1">++</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L431" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="431"></td>
      <td id="LC431" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">url</span> <span class="pl-c1">&amp;&amp;</span> <span class="pl-c1">!</span><span class="pl-en">isExcludedUrl</span><span class="pl-kos">(</span><span class="pl-s1">url</span><span class="pl-kos">)</span> <span class="pl-c1">&amp;&amp;</span> <span class="pl-c1">!</span><span class="pl-s1">isPublicFile</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L432" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="432"></td>
      <td id="LC432" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-c">// &lt;script type="module" src="..."/&gt;</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L433" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="433"></td>
      <td id="LC433" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-c">// add it as an import</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L434" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="434"></td>
      <td id="LC434" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-s1">js</span> <span class="pl-c1">+=</span> <span class="pl-s">`\nimport <span class="pl-s1"><span class="pl-kos">${</span><span class="pl-smi">JSON</span><span class="pl-kos">.</span><span class="pl-en">stringify</span><span class="pl-kos">(</span><span class="pl-s1">url</span><span class="pl-kos">)</span><span class="pl-kos">}</span></span>`</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L435" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="435"></td>
      <td id="LC435" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-s1">shouldRemove</span> <span class="pl-c1">=</span> <span class="pl-c1">true</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L436" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="436"></td>
      <td id="LC436" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">node</span><span class="pl-kos">.</span><span class="pl-c1">childNodes</span><span class="pl-kos">.</span><span class="pl-c1">length</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L437" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="437"></td>
      <td id="LC437" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-k">const</span> <span class="pl-s1">scriptNode</span> <span class="pl-c1">=</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L438" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="438"></td>
      <td id="LC438" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">         <span class="pl-s1">node</span><span class="pl-kos">.</span><span class="pl-c1">childNodes</span><span class="pl-kos">.</span><span class="pl-en">pop</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-k">as</span> <span class="pl-smi">DefaultTreeAdapterMap</span><span class="pl-kos">[</span><span class="pl-s">'textNode'</span><span class="pl-kos">]</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L439" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="439"></td>
      <td id="LC439" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-k">const</span> <span class="pl-s1">contents</span> <span class="pl-c1">=</span> <span class="pl-s1">scriptNode</span><span class="pl-kos">.</span><span class="pl-c1">value</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L440" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="440"></td>
      <td id="LC440" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-c">// &lt;script type="module"&gt;...&lt;/script&gt;</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L441" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="441"></td>
      <td id="LC441" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-k">const</span> <span class="pl-s1">filePath</span> <span class="pl-c1">=</span> <span class="pl-s1">id</span><span class="pl-kos">.</span><span class="pl-en">replace</span><span class="pl-kos">(</span><span class="pl-en">normalizePath</span><span class="pl-kos">(</span><span class="pl-s1">config</span><span class="pl-kos">.</span><span class="pl-c1">root</span><span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s">''</span><span class="pl-kos">)</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L442" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="442"></td>
      <td id="LC442" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-en">addToHTMLProxyCache</span><span class="pl-kos">(</span><span class="pl-s1">config</span><span class="pl-kos">,</span> <span class="pl-s1">filePath</span><span class="pl-kos">,</span> <span class="pl-s1">inlineModuleIndex</span><span class="pl-kos">,</span> <span class="pl-kos">{</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L443" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="443"></td>
      <td id="LC443" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">         <span class="pl-c1">code</span>: <span class="pl-s1">contents</span><span class="pl-kos">,</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L444" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="444"></td>
      <td id="LC444" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-kos">}</span><span class="pl-kos">)</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L445" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="445"></td>
      <td id="LC445" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-s1">js</span> <span class="pl-c1">+=</span> <span class="pl-s">`\nimport "<span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">id</span><span class="pl-kos">}</span></span>?html-proxy&amp;index=<span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">inlineModuleIndex</span><span class="pl-kos">}</span></span>.js"`</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L446" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="446"></td>
      <td id="LC446" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-s1">shouldRemove</span> <span class="pl-c1">=</span> <span class="pl-c1">true</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L447" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="447"></td>
      <td id="LC447" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-kos">}</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L448" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="448"></td>
      <td id="LC448" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
    </tr>

    <tr class="border-0">
      <td id="L449" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="449"></td>
      <td id="LC449" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-s1">everyScriptIsAsync</span> <span class="pl-c1">&amp;&amp;=</span> <span class="pl-s1">isAsync</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L450" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="450"></td>
      <td id="LC450" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-s1">someScriptsAreAsync</span> <span class="pl-c1">||=</span> <span class="pl-s1">isAsync</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L451" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="451"></td>
      <td id="LC451" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-s1">someScriptsAreDefer</span> <span class="pl-c1">||=</span> <span class="pl-c1">!</span><span class="pl-s1">isAsync</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L452" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="452"></td>
      <td id="LC452" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">url</span> <span class="pl-c1">&amp;&amp;</span> <span class="pl-c1">!</span><span class="pl-s1">isPublicFile</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L453" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="453"></td>
      <td id="LC453" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-c1">!</span><span class="pl-en">isExcludedUrl</span><span class="pl-kos">(</span><span class="pl-s1">url</span><span class="pl-kos">)</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L454" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="454"></td>
      <td id="LC454" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-s1">config</span><span class="pl-kos">.</span><span class="pl-c1">logger</span><span class="pl-kos">.</span><span class="pl-en">warn</span><span class="pl-kos">(</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L455" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="455"></td>
      <td id="LC455" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">         <span class="pl-s">`&lt;script src="<span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">url</span><span class="pl-kos">}</span></span>"&gt; in "<span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">publicPath</span><span class="pl-kos">}</span></span>" can't be bundled without type="module" attribute`</span><span class="pl-kos">,</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L456" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="456"></td>
      <td id="LC456" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-kos">)</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L457" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="457"></td>
      <td id="LC457" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-kos">}</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L458" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="458"></td>
      <td id="LC458" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">node</span><span class="pl-kos">.</span><span class="pl-c1">childNodes</span><span class="pl-kos">.</span><span class="pl-c1">length</span><span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L459" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="459"></td>
      <td id="LC459" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-k">const</span> <span class="pl-s1">scriptNode</span> <span class="pl-c1">=</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L460" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="460"></td>
      <td id="LC460" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       <span class="pl-s1">node</span><span class="pl-kos">.</span><span class="pl-c1">childNodes</span><span class="pl-kos">.</span><span class="pl-en">pop</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-k">as</span> <span class="pl-smi">DefaultTreeAdapterMap</span><span class="pl-kos">[</span><span class="pl-s">'textNode'</span><span class="pl-kos">]</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L461" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="461"></td>
      <td id="LC461" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-s1">scriptUrls</span><span class="pl-kos">.</span><span class="pl-en">push</span><span class="pl-kos">(</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L462" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="462"></td>
      <td id="LC462" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">       ...<span class="pl-en">extractImportExpressionFromClassicScript</span><span class="pl-kos">(</span><span class="pl-s1">scriptNode</span><span class="pl-kos">)</span><span class="pl-kos">,</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L463" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="463"></td>
      <td id="LC463" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-kos">)</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L464" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="464"></td>
      <td id="LC464" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-kos">}</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L465" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="465"></td>
      <td id="LC465" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> <span class="pl-kos">}</span> </td>
    </tr>
</tbody>

if (isModule) {

When appType: 'spa' | 'mpa', Vite serves HTML itself, and htmlFallbackMiddleware rewrites req.url to the canonical path of index.html,

vite/packages/vite/src/node/server/middlewares/htmlFallback.ts

Lines 44 to 47 in 73ef074

    <tbody>

    <tr class="border-0">
      <td id="L45" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="45"></td>
      <td id="LC45" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-k">const</span> <span class="pl-s1">newUrl</span> <span class="pl-c1">=</span> <span class="pl-s1">url</span> <span class="pl-c1">+</span> <span class="pl-s">'index.html'</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L46" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="46"></td>
      <td id="LC46" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-en">debug</span><span class="pl-kos">?.</span><span class="pl-kos">(</span><span class="pl-s">`Rewriting <span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">req</span><span class="pl-kos">.</span><span class="pl-c1">method</span><span class="pl-kos">}</span></span> <span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">req</span><span class="pl-kos">.</span><span class="pl-c1">url</span><span class="pl-kos">}</span></span> to <span class="pl-s1"><span class="pl-kos">${</span><span class="pl-s1">newUrl</span><span class="pl-kos">}</span></span>`</span><span class="pl-kos">)</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L47" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="47"></td>
      <td id="LC47" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-s1">req</span><span class="pl-kos">.</span><span class="pl-c1">url</span> <span class="pl-c1">=</span> <span class="pl-s1">newUrl</span> </td>
    </tr>
</tbody>

if (fs.existsSync(filePath)) {

so the url passed to server.transformIndexHtml is /index.html.

However, if appType: 'custom', HTML is served manually, and if server.transformIndexHtml is called with the unmodified request URL (as the SSR docs suggest), then the path of the transformed html-proxy script varies with the request URL. For example, a request with path / produces

<script type="module" src="/@id/__x00__/index.html?html-proxy&index=0.js"></script>

It is possible to abuse this behavior by crafting a request URL to contain a malicious payload like

"></script><script>alert('boom')</script>

so a request to http://localhost:5173/?%22%3E%3C/script%3E%3Cscript%3Ealert(%27boom%27)%3C/script%3E produces HTML output like

<script type="module" src="/@id/__x00__/?"></script><script>alert("boom")</script>?html-proxy&index=0.js"></script>

which demonstrates XSS.

PoC

• Example 1. Serving HTML from vite dev middleware with appType: 'custom'
  • Go to https://stackblitz.com/edit/vitejs-vite-9xhma4?file=main.js&terminal=dev-html
  • "Open in New Tab"
  • Edit URL to set query string to ?%22%3E%3C/script%3E%3Cscript%3Ealert(%27boom%27)%3C/script%3E and navigate
  • Witness XSS:
  • 
• Example 2. Serving HTML from SSR-style Express server (Vite dev server runs in middleware mode):
  • Go to https://stackblitz.com/edit/vitejs-vite-9xhma4?file=main.js&terminal=server
  • (Same steps as above)
• Example 3. Plain vite dev (this shows that vanilla vite dev is not vulnerable, provided htmlFallbackMiddleware is used)
  • Go to https://stackblitz.com/edit/vitejs-vite-9xhma4?file=main.js&terminal=dev
  • (Same steps as above)
  • You should not see the alert box in this case

Detailed Impact

This will probably predominantly affect development-mode SSR, where vite.transformHtml is called using the original req.url, per the docs:

vite/docs/guide/ssr.md

Lines 114 to 126 in 7fd7c6c

    <tbody>

    <tr class="border-0">
      <td id="L115" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="115"></td>
      <td id="LC115" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
    </tr>

    <tr class="border-0">
      <td id="L116" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="116"></td>
      <td id="LC116" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> <span class="pl-k">try</span> { </td>
    </tr>

    <tr class="border-0">
      <td id="L117" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="117"></td>
      <td id="LC117" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-c"><span class="pl-c">//</span> 1. Read index.html</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L118" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="118"></td>
      <td id="LC118" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-k">let</span> template <span class="pl-k">=</span> <span class="pl-smi">fs</span>.<span class="pl-en">readFileSync</span>( </td>
    </tr>

    <tr class="border-0">
      <td id="L119" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="119"></td>
      <td id="LC119" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-smi">path</span>.<span class="pl-en">resolve</span>(<span class="pl-c1">__dirname</span>, <span class="pl-s"><span class="pl-pds">'</span>index.html<span class="pl-pds">'</span></span>), </td>
    </tr>

    <tr class="border-0">
      <td id="L120" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="120"></td>
      <td id="LC120" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">     <span class="pl-s"><span class="pl-pds">'</span>utf-8<span class="pl-pds">'</span></span>, </td>
    </tr>

    <tr class="border-0">
      <td id="L121" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="121"></td>
      <td id="LC121" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   ) </td>
    </tr>

    <tr class="border-0">
      <td id="L122" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="122"></td>
      <td id="LC122" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
    </tr>

    <tr class="border-0">
      <td id="L123" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="123"></td>
      <td id="LC123" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-c"><span class="pl-c">//</span> 2. Apply Vite HTML transforms. This injects the Vite HMR client,</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L124" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="124"></td>
      <td id="LC124" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-c"><span class="pl-c">//</span>    and also applies HTML transforms from Vite plugins, e.g. global</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L125" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="125"></td>
      <td id="LC125" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   <span class="pl-c"><span class="pl-c">//</span>    preambles from @vitejs/plugin-react</span> </td>
    </tr>

    <tr class="border-0">
      <td id="L126" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="126"></td>
      <td id="LC126" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">   template <span class="pl-k">=</span> <span class="pl-k">await</span> <span class="pl-smi">vite</span>.<span class="pl-en">transformIndexHtml</span>(url, template) </td>
    </tr>
</tbody>

const url = req.originalUrl

However, since this vulnerability affects server.transformIndexHtml, the scope of impact may be higher to also include other ad-hoc calls to server.transformIndexHtml from outside of Vite's own codebase.

My best guess at bisecting which versions are vulnerable involves the following test script

import fs from 'node:fs/promises';
import * as vite from 'vite';
const html = </span> <span class="pl-s">&lt;!DOCTYPE html&gt;</span> <span class="pl-s">&lt;html lang="en"&gt;</span> <span class="pl-s">  &lt;head&gt;</span> <span class="pl-s">    &lt;meta charset="UTF-8" /&gt;</span> <span class="pl-s">  &lt;/head&gt;</span> <span class="pl-s">  &lt;body&gt;</span> <span class="pl-s">    &lt;script type="module"&gt;</span> <span class="pl-s">      // Inline script</span> <span class="pl-s">    &lt;/script&gt;</span> <span class="pl-s">  &lt;/body&gt;</span> <span class="pl-s">&lt;/html&gt;</span> <span class="pl-s">;

const server = await vite.createServer({ appType: 'custom' });

const transformed = await server.transformIndexHtml('/?%22%3E%3C/script%3E%3Cscript%3Ealert(%27boom%27)%3C/script%3E', html);

console.log(transformed);

await server.close();

and using it I was able to narrow down to #13581. If this is correct, then vulnerable Vite versions are 4.4.0-beta.2 and higher (which includes 4.4.0).

Release Notes

4.4.12

Please refer to CHANGELOG.md for details.

4.4.11

Please refer to CHANGELOG.md for details.

4.4.10

Please refer to CHANGELOG.md for details.

Does any of this look wrong? Please let us know.

Commits

See the full diff on Github. The new version differs by 29 commits:

• release: v4.4.12
• fix: backport #15223, proxy html path should be encoded (#15226) (#15227)
• release: v4.4.11
• revert: "fix: use string manipulation instead of regex to inject esbuild helpers
• release: v4.4.10
• fix: restore builtins list
• fix(resolve): support submodules of optional peer deps (#14489)
• fix(analysis): warnings for dynamic imports that use static template literals (#14458)
• fix(import-analysis): preserve importedUrls import order (#14465)
• fix: handle errors during `hasWorkspacePackageJSON` function (#14394)
• feat: improve deno and bun support (#14379)
• fix(manifest): preserve pure css chunk assets (#14297)
• fix(css): reset render cache on renderStart (#14326)
• fix(optimizer): define crawlDeps after scanProcessing and optimizationResult are complete (fix #14284) (#14285)
• fix: include `vite/types/*` in exports field (#14296)
• fix(css): remove pure css chunk sourcemap (#14290)
• fix(cli): convert special base (#14283)
• fix: add source map to Web Workers (fix #14216) (#14217)
• fix(vite): precisely check if files are in dirs (#14241)
• fix: handle sourcemap correctly when multiple line import exists (#14232)
• fix: use string manipulation instead of regex to inject esbuild helpers (#14094)
• fix: if host is specified check whether it is valid (#14013)
• fix: initWasm options should be optional (#14152)
• fix: ws never connects after restarting server if server.hmr.server is set (#14127)
• fix(glob): trigger HMR for glob in a package (#14117)
• ci: use Node 18.17 for Windows due to a bug in Node (#14507)
• docs: better links for ViteConf
• docs: icon in ViteConf action
• docs: viteconf 23 link (#14075)

---

Depfu will automatically keep this PR conflict-free, as long as you don't add any commits to this branch yourself. You can also trigger a rebase manually by commenting with @depfu rebase.

All Depfu comment commands

@​depfu rebase

Rebases against your default branch and redoes this update

@​depfu recreate

Recreates this PR, overwriting any edits that you've made to it

@​depfu merge

Merges this PR once your tests are passing and conflicts are resolved

@​depfu cancel merge

Cancels automatic merging of this PR

@​depfu close

Closes this PR and deletes the branch

@​depfu reopen

Restores the branch and reopens this PR (if it's closed)

@​depfu pause

Ignores all future updates for this dependency and closes this PR

@​depfu pause [minor|major]

Ignores all future minor/major updates for this dependency and closes this PR

@​depfu resume

Future versions of this dependency will create PRs again (leaves this PR as is)

[depfu]

Closed in favor of #106.