In deploying a new NextJS app there are some legacy routes that need to be preserved from the old, non-NextJS site.
/const-string-[long-unique-hash] is used currently for a httpd conf redirect:
Ex. RewriteRule ^const-string-(.*)$ https://google.com?q=const-string-$1 [L,NC]
How can I preserve NextJS routing, but allow for legacy routes matching the path: /const-string-*?
Desired behavior:
/blog routes pages/blog.js
/const-string-a1b2c3d4 routes to https://google.com?q=const-string-a1b2c3d4
Current behavior (only localhost testing so far):
/blog routes pages/blog.js works as expected
/const-string-a1b2c3d4 routes to 404
How can I catch urls matching this string before it's redirected to 404?
For others that may wish to do the same, I ended up using a custom 404.js file to handle redirects like this.
pages/404.js:
import {useRouter} from 'next/router';
import { useEffect, useState } from 'react';
export default function Custom404() {
const router = useRouter();
const [route, setRoute] = useState('');
var regex = new RegExp(/const-string-([0-9A-Za-z-]+)/gi);
var matches = route.match(regex);
useEffect(() => {
setRoute(router.asPath);
window.location.href = (matches ? "https://google.com/?q=" + matches[0] : '/?404');
}, [router, matches]);
return <h1>Redirecting...</h1>
}