Let's say you have a web service that you've managed to launch. And let's say you've decided to separate the marketing content from the application because you want to be able to deploy updates to the marketing copy without having to redeploy the whole application.

You now have two sites set up on Netlify: https://www.myshiny.com for the marketing content, and https://app.myshiny.com for the application.

But say your application generates some pages that are publicly visible, and you want these to be accessible through the marketing site. For example, your app might result in user generated pages like https://app.myshiny.com/@username, but wouldn't it look much better if it was accessible via https://www.myshiny.com/@username instead?

Provided both sites are under the same team in Netlify, you can set up proxy redirects.

In the marketing site netlify.toml (or in the equivalent syntax for _redirects) create redirect directives for the paths you want proxied:

Loading...
[[redirects]]
  from = "/@*"
  to = "https://app.myshiny.com/@:splat"
  status = 200
  force = true

The trick with this is that all your assets for your proxied application pages will also use the marketing page url so the application will need to be updated to include the app domain as the URL prefix.

create-react-app

In CRA, it should just be a matter of explicitly setting PUBLIC_URL to the application domain. If you have i18n set up, your translation paths also need to have the PUBLIC_URL prepended. With react-i18next, this may mean updating the backeend.loadPath.

Next.js

In Next.js, next.config.js will need to have:

Loading...
assetPrefix: "https://app.myshiny.com",
images: {
    ...
    path: 'https://app.myshiny.com/_next/image',
},

Limitations

As I mentioned before, both sites need to be under the same team on Netlify. There are other limitations but you can see what they are in Netlify's documentation below.

See also

• Netlify: Rewrites and proxies