RFC - URL Rewriting

[tommerty]

Flexible rewrites similar to NextJS' NextResponse.rewrite which helps many SaaS developers offer multi tenant and dynamic platforms. The goal is to provide developers with a powerful tool to dynamically modify routing behavior based on various conditions, such as hostnames, paths, or custom logic.

As it stands, there's no simple way to include multi-tenancy/ custom domain routing / or conditional path rewrites for those building such applications. And it's been agreed across the board that NextJS have the upper hand on this. By introducing a built-in rewrite mechanism that can be added within middleware, this should break down a lot of walls.

The proposal is for a rewrite option to the TanStack Router/Start configuration. This option would allow developers to define rules for rewriting routes based on various conditions.

A great example would be the Vercel Multi-tenant template they provide. Example

Another reference would be the NextResponse documentation

So, if redirect works like this:

import { redirect } from '@tanstack/react-router'
const route = createRoute({
  // throwing a redirect object
  loader: () => {
    if (!user) {
      throw redirect({
        to: '/login',
      })
    }
  },
})

rewrite could work like this:

import { rewrite } from '@tanstack/react-router'
const route = createRoute({
  loader: () => {
    if (path = /auth) {
      throw rewrite(
new URL(`${path === "/auth" ? "" : path}`, req.url)
      )
    }
  },
})

[dotnize]

Similar RFCs/docs from other frameworks:

Astro

• Reroute API withastro/roadmap#681
• https://docs.astro.build/en/guides/routing/#rewrites

Remix

• [Feature]: middleware before Remix processes request remix-run/remix#2857
• Route Segment Constraints remix-run/remix#7111

SvelteKit

• feat: add reroute hook sveltejs/kit#11537
• https://svelte.dev/docs/kit/hooks#Universal-hooks-reroute

And a pretty nice post that explores the feature in various frameworks:
https://egoist.dev/multi-tenant-web-app-2024