0

I'm hosting a static (NextJS) site on a GCP bucket, with my domain CNAME (let's say example.com) pointing to GCP. When Javascript is disabled, NextJS links in my generated content point to URLs like:

<a href="https://example.com/pages/1">Page 1</a>

but the actual file stored in the bucket is:

pages/1.html

which generates a 404 error when Javascript is disabled and <Link> doesn't capture the click.

I'm aware of the specialty page option MainPageSuffix in GCP, but I have it set as index.html and I don't think it can be set to rewrite someaddress to someaddress.html (and even if it could, it would not serve my root index.html corrctly when I point my browser to example.com)

I'm also aware of the as option in NextJS, but if I use it like:

<Link
   href={`/pages/1`}
   as={`/pages/1.html`}
>

it will not work when Javascript is enabled and I'm serving the site locally with npm run dev (I suppose it confuses <Link>?).

Is there any way to make this work? I'm using Next.js v13.0.7

(Alternatively, is there any other (free tier) option to host my site? I thought I could use Cloudflare Pages, but my static site has a lot of small pages - in the order of 100k - and Pages has a file limit of 20k)

janesconference
  • 6,333
  • 8
  • 55
  • 73
  • Please check out these links : https://stackoverflow.com/questions/62867105/how-to-deal-with-nextjs-exporting-files-with-html-extension-but-inlink-there https://stackoverflow.com/questions/63194440/how-to-remove-html-extension-to-static-website-in-google-cloud-bucket https://cloud.google.com/storage/docs/hosting-static-website-http#specialty-pages – Vaidehi Jamankar Dec 30 '22 at 12:42

0 Answers0