React Router saw a minor version bump from 7.5.0 to 7.5.1, introducing subtle but potentially impactful changes for developers. The core functionality of declarative routing for React remains consistent, ensuring a familiar experience for existing users. However, inspecting the package manifests highlights specific differences in the dependency structure.
Version 7.5.1 removes the direct dependency on @types/cookie, which was present in version 7.5.0. This suggests that the maintainers may have either found these type definitions unnecessary within the main package or moved to a different approach for handling cookie-related types. Additionally, the unpacked size of the package increased from 2,534,310 bytes in 7.5.0 to 2,585,576 bytes in 7.5.1. While seemingly small, this increase could stem from internal code adjustments, new features, or dependency updates beyond the immediate dependencies block(like the addition of new tests for example).
Both versions share the same peer dependencies on React and React DOM (>=18), ensuring compatibility with modern React applications. The development dependencies, including tools for building and testing like tsup, typescript, and related type definitions, remain consistent as well. Developers considering upgrading should assess their cookie handling implementation to ensure compatibility with the removal of @types/cookie. They should also be aware of a release date bug in version 7.5.1 of more than 1 year in the future (2025-04-17).
All the vulnerabilities related to the version 7.5.1 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.
React Router allows a DoS via cache poisoning by forcing SPA mode
After some research, it turns out that it is possible to force an application to switch to SPA mode by adding a header to the request. If the application uses SSR and is forced to switch to SPA, this causes an error that completely corrupts the page. If a cache system is in place, this allows the response containing the error to be cached, resulting in a cache poisoning that strongly impacts the availability of the application.
The vulnerable header is X-React-Router-SPA-Mode
; adding it to a request sent to a page/endpoint using a loader throws an error. 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
)/ssr
in our case) adding the following header:X-React-Router-SPA-Mode: yes
Notice the difference between a request with and without the header;
Normal request
With the header
If a system cache is in place, it is possible to poison the response by completely altering its content (by an error message), strongly impacting its availability, making the latter impractical via a cache-poisoning attack.