Redirects and Rewrites
Since static sites don’t have a server-side component that can redirect or rewrite HTTP requests, Render lets you define redirect and rewrite rules for your static sites in the dashboard.
The Difference Between Redirects and Rewrites
A Redirect rule instructs the client (usually a browser) to switch URLs and navigate to the destination of the rule. Redirect rules are typically used for old paths that you’d like to redirect to new ones.
In contrast, a Rewrite rule does not change the original URL; it simply serves the content of the rule destination at the original path. The browser cannot tell that the content was served from a different path or URL, making it possible to display content from a different path or URL on any other path on your site. Rewrite rules are also needed for client-side routing, so frameworks like react-router and Vue Router can handle all requests at index.html
.
Rule Matching and Ordering
Redirect and rewrite rules are only matched if no existing content is found at a path. This ensures existing content isn’t accidentally overwritten by a rule, and allows wildcard rules to exist without overwriting valid paths.
Once Render determines there is no content on a path, it starts matching your rules in order starting from the top. The first matching rule is applied to the request.
Rule Syntax
The source must be a path and not a full URL. It will be matched with the path of the request URL.
The destination can be a path or a full publicly accessible URL.
Examples:
Source | Destination |
---|---|
/home | / |
/blog/index.html | /blog |
/web-host | https://render.com |
Wildcards
You can use wildcards to match arbitrary request paths.
Use *
for wildcard matching in the source path.
Use *
in the destination to represent everything captured by the wildcard in the source path.
Source | Destination | Effect |
---|---|---|
/* | /blog/* | /path1/path2 → /blog/path1/path2 |
/* | /index.html | All requests → /index.html |
Placeholders
You can use placeholders to use specific parts of the URL in your destination paths.
Source | Destination | Effect |
---|---|---|
/:foo/bar | /bar/:foo | /hello/bar → /bar/hello |
/parent/:child | /:child | /parent/daughter → /daughter |
/post/:year/:month/:day | /article/:month/:day/:year | /post/2020/11/03 → /article/11/03/2020 |