React Router DOM has released version 7.0.2, a minor update following closely on the heels of version 7.0.1. Both versions provide declarative routing for React web applications, ensuring a smooth and intuitive navigation experience for users. A key element shared by both versions is the dependency on corresponding versions of the core react-router package, maintaining tight integration between the two.
Examining the package data, the core functionalities and development dependencies remain consistent. Both rely on the same versions of essential tools like tsup for bundling, react and react-dom for the React environment, wireit for managing scripts, and typescript for type safety. The peer dependencies also remain unchanged, requiring React and React DOM versions of at least 18. This stability ensures developers can upgrade without major code modifications, provided they adhere to the React 18 ecosystem. The file count and unpacked sizes are equal, pointing to optimizations being consistent.
The most notable difference lies in the release dates. Version 7.0.2 was released on December 3rd, 2024, while 7.0.1 was released on November 22nd, 2024. This suggests that 7.0.2 likely includes minor bug fixes or small enhancements implemented after the release of 7.0.1. Developers should consider upgrading to the newest release so they work on the most updated code. As both are very recent, it's advisable to review the React Router changelog for any detailed information on specific fixes or improvements included in the 7.0.2 release.
All the vulnerabilities related to the version 7.0.2 of the package
React Router allows pre-render data spoofing on React-Router framework mode
After some research, it turns out that it's possible to modify pre-rendered data by adding a header to the request. This allows to completely spoof its contents and modify all the values of the data object passed to the HTML. Latest versions are impacted.
The vulnerable header is X-React-Router-Prerender-Data
, a specific JSON object must be passed to it in order for the spoofing to be successful as we will see shortly. Here is the vulnerable code :
To use the header, React-router must be used in Framework mode, and for the attack to be possible the target page must use a loader.
Versions used for our PoC:
routes/ssr
).data
. In our case the page is called /ssr
:We access it by adding the suffix .data
and retrieve the data object, needed for the header:
X-React-Router-Prerender-Data
header with the previously retrieved object as its value. You can change any value of your data
object (do not touch the other values, the latter being necessary for the object to be processed correctly and not throw an error):As you can see, all values have been changed/overwritten by the values provided via the header.
The impact is significant, if a cache system is in place, it is possible to poison a response in which all of the data transmitted via a loader would be altered by an attacker allowing him to take control of the content of the page and modify it as he wishes via a cache-poisoning attack. This can lead to several types of attacks including potential stored XSS depending on the context in which the data is injected and/or how the data is used on the client-side.