Skip to content
← Back to Guides

Can I redirect from a subdomain to a subpath?

Vercel (and Next.js) both offer the ability to add Redirects and Rewrites to your application. This approach is commonly used for subpaths. For example, adding a redirect from acme.com/old to acme.com/new.

If you want to rewrite app.acme.com to acme.com/app, you'll need to configure a rewrite making use of the has field.

Configuring a Rewrite with 'has' Field

  1. Create a next.config.js file is using Next.js or a vercel.json file like below.
  2. Push your changes and redeploy your application.
1
rewrites() {
2
    return {
3
        beforeFiles: [
4
            // if the host is `app.acme.com`,
5
            // this rewrite will be applied
6
            {
7
                source: '/:path*',
8
                has: [
9
                    {
10
                        type: 'host',
11
                        value: 'app.acme.com',
12
                    },
13
                ],
14
                destination: '/app/:path*',
15
            },
16
        ]
17
    }
18
}
An example rewrite object configuration inside next.config.js.. Only paths with app.acme.com will be rewritten.
1
{
2
  "rewrites": [
3
    {
4
      "source": "/:path*",
5
      "has": [
6
        {
7
          "type": "host",
8
          "value": "app.acme.com"
9
        }
10
      ],
11
      "destination": "/app/:path*"
12
    }
13
  ]
14
}
An example rewrite object configuration inside vercel.json.

When a request is made to app.acme.com, then it will be rewritten to acme.com/app.

Couldn't find the guide you need?