Redirects
Overview
Redirects can be added in 2 ways. Either in a flat file (you'll need Falcon Server access for this), or, they can come from your shops API package.
Flat redirects (Enterprise Only)
To add flat redirects you must first create a server/config/redirects.txt
file. You can then add your redirects there. All redirects added to this file are treated as 301
.
This file path can be configured in your server/config
files. The config variable is redirectFile
{
...
"redirectFile": "config/redirects.txt" // default file path
}
1 to 1 redirect
The format of this file should have each redirect on a new line with the orgin and destination seperated by a space.
origin destination
example
/product-1 /product-2
In this example the url /product-1
will 301 redirect to /product-2
Regex support
We also support regex. Any entry prefixed with @
is considered regex.
example
@\/product-1$ /product-2
In this example any url that ends in /product-1
will be redirected to /product-2
Query string support
If you want to pass query parameters accross that is also possible by assigning them to a variable using (.*)$
.
Each time you use the string (.*)$
it is passed as a variable in numberical order to $1
and then $2
and so on.
example
@\/product-1(\?.*)?$ /product-2$1
In this example everything after product-1
is saved as $1
and passed to the end of the destination. e.g. https://deity.com/product-1?id=1&project=2
=> https://deity.com/product-2?id=1&project=2
example 2
@^(.*)\/product-1(.*)$ $1/product-2$2
In this example everything before product-1
is set to $1
and everything after is set to $2
. e.g. https://deity.com/products/product-1?id=1&project=2
=> https://deity.com/products/product-2?id=1&project=2
Shop API redirects
Redirect support is directly injected into your shops fetchUrl()
method.
We check for URL matches, if none are returned we then query the shops redirect API. If a match is found we return an object:
{
path, // the location to be redirected
status // the type of redirect e.g. 301, 302, 404
}
Implementation
To get redirects to work you'll need to make sure you have a DynamicRedirect
component in your route App.js
.
This uses react-router-dom
to handle the redirect.
client/src/components/DynamicRedirect.js
import React from 'react';
import { Redirect } from 'react-router-dom';
export const DynamicRedirect = ({ match, location, staticContext }) => {
const { path, status = 301 } = match.params;
if (staticContext) {
staticContext.status = status;
}
return <Redirect from={location.pathname} to={path} />;
};
client/src/App.js
...
import { ..., DynamicRedirect } from './components';
...
const App = () => (
...
<SwitchDynamicURL onLoading={({ component }) => <LoaderWrapper>{component}</LoaderWrapper>}>
...
<Route exact type="redirect" component={DynamicRedirect} />
<Route component={NotFound} />
</SwitchDynamicURL>
...
)
n.b. the DynamicRedirect
should be passed to the second to last Route
component to allow the other routes to be rendered with a higher priority.
server/config/redirects.txt (for flat redirects)
/contact/ /contact-us/
/old-product/ /new-product/
/old-page/ /