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:

SourceDestination
/home/
/blog/index.html/blog
/web-hosthttps://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.

SourceDestinationEffect
/*/blog/*/path1/path2/blog/path1/path2
/*/index.htmlAll requests → /index.html

Placeholders

You can use placeholders to use specific parts of the URL in your destination paths.

SourceDestinationEffect
/: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