Next.js 404 on refresh

Question

I have Next.js page like page.js so it can be reach through http://localhost:3000/page. But for some reason I would like to get this page through an another url http://localhost:3000/my-page

So I used Link component like this way

<link href="/page" as="my-page">
    <a>
        My link to page
    </a>
</link>

Problem is that if I refresh browser, I get a 404 error page if I do not use as property it works.

How can I prevent this behavior ?

Answer 1

This is because you're using a SPA, in this cases the router is different because the routes are loaded with the principal component