Alias an app router route
Answered
Asiatic Lion posted this in #help-forum
Asiatic LionOP
I got a site that use the same path structure as another to provide easy link creation. However I need to have the two routes act the same, despite being different
Essentially, I'd like for
I've though about making the
Any advice on this? I'm returning from the 13.x days so I may have forgotten things.
Essentially, I'd like for
my.app/track/[id] to act like my already existing my.app/recording/[id] page, along side the opengraph image, layout, etc...I've though about making the
track element a slug, on which I selectively filter out anything I don't want, however this prevent me from having a my.app/faq page, and is very hacky. Any advice on this? I'm returning from the 13.x days so I may have forgotten things.
Answered by Asiatic Lion
That exemple wasn't enough as I have a parameter, but I got it to work by finding the doc
async rewrites() {
return {
beforeFiles: [
// These rewrites are checked after headers/redirects
// and before all files including _next/public files which
// allows overriding page files
{
source: "/track/:mbid",
destination: "/recording/:mbid",
},
],
};
},2 Replies
@Asiatic Lion I got a site that use the same path structure as another to provide easy link creation. However I need to have the two routes act the same, despite being different
Essentially, I'd like for `my.app/track/[id]` to act like my already existing `my.app/recording/[id]` page, along side the opengraph image, layout, etc...
I've though about making the `track` element a slug, on which I selectively filter out anything I don't want, however this prevent me from having a `my.app/faq` page, and is very hacky.
Any advice on this? I'm returning from the 13.x days so I may have forgotten things.
inside your next.js config you can add a "rewrite" object. It rewrites a specific route to another. In your case, you want to rewrite my.app/track/[id] to the my.app/recording/[id]:
module.exports = {
async rewrites() {
return [
{
source: '/about',
destination: '/',
},
]
},
}Asiatic LionOP
That exemple wasn't enough as I have a parameter, but I got it to work by finding the doc
async rewrites() {
return {
beforeFiles: [
// These rewrites are checked after headers/redirects
// and before all files including _next/public files which
// allows overriding page files
{
source: "/track/:mbid",
destination: "/recording/:mbid",
},
],
};
},Answer