How do I perform Vercel redirects based on query strings?

When using redirects with the vercel.json or next.config.js configuration file, your URL may contain query string parameters that you would like to use in your redirection. This article explains the two methods possible to achieve this.

Include query strings in redirect destination

By default, all query strings that are found in the source path will be passed to the destination path. In the example configuration below, if the source is /?baz=10, the destination will be /lol/?path=foo&baz=10.

1
{
2
   "redirects":[
3
      {
4
         "source":"/",
5
         "destination":"/lol/?path=foo"
6
      }
7
   ]
8
}

Redirect based on value of query string

Using the has property, you can redirect to a specific route based on the value of the query parameter being present. For example, in the configuration below, if the source is /specific/mypath?page=home&id=1000, it will be redirected to /another/mypath?page=home&id=1000.

1
{
2
  "redirects": [
3
    {
4
      "source": "/specific/:path*",
5
      "has": [
6
        {
7
          "type": "query",
8
          "key": "page",
9
          "value": "home"
10
        }
11
      ],
12
      "permanent": false,
13
      "destination": "/another/:path*"
14
    }
15
  ]
16
}

For details related to using the has field, review this page for next.config.js and this page for vercel.json.