ServerLocation
React Router A React Router Location for universal apps.
ServerLocation
Do?
What does -
Normalizes & exposes server-side request data so that React Router (and your components) can respond to all HTTP methods (e.g.
GET
,POST
). -
Redirects server-side requests when the router transitions to another URL.
-
Correctly supports complex, deep query strings (e.g.
?foo[bar][baz][bing]=...
) -
Allows the use of
<Redirect>
routes on the server as well as the client.
ServiceLocation
?
Why By default, React Router uses StaticLocation
on the server which does not support transitions. Also, in my experience,
the onAbort
handler has not been a reliable means of handling this behavior.
Plus, ServerLocation
allows your app components to take advantage of:
- Redirect server-side requests via
router.transitionTo
. - The HTTP method via
query._method
(e.g.GET
,POST
). POST
params are available on thequery
like normalGET
query params.- Access to HTTP headers via
query._headers
(which is useful for pivoting off ofX-Requested-With
)
Installation
$ npm install --save react-router-server-location
Usage
First, include ServerLocation
as a dependency:
;
Next, create an instance using your server's request & response objects:
// Expressconst location = req res ; // or Hapiconst location = request reply ;
Finally, use React Router as normal:
Router;
Now, calls to router.transitionTo
will redirect as expected on the server,
and POST
requests to your server-side React application can be supported!
If you'd like to handle redirects manually, you can instead pass a callback:
const location = req { // Maybe save data to the session... reqsessionredirected = true; res;};
The res
or reply
objects aren't necessary since we're providing our own
callback.
Authors
License
Collaboration
If you have questions or issues, please open an issue!