next.js export static - S3 - routing fails on page reload

穿精又带淫゛_ 提交于 2020-06-27 16:37:06

问题


I'm deploying a next.js app as a static export, to an s3 bucket configured for static website hosting.

I use next's build and export commands to generate the out/ directory and then copy that into my s3 bucket

The bucket then contains some files, for simplicity lets say there's just index.html and about.html

The problem is when a user hits index.html via www.website.com then navigates to www.website.com/about everything works, but reloading www.website.com/about fails of course.

www.website.com/about.html finds the correct asset to render the site however

Is there a way to export a static next.js app, host on s3, and have requests to /about proxy /about.html ?

As always, thanks for looking, and thanks even more for participating.


回答1:


The best solution I've arrived at so far, inspired by this gist: https://gist.github.com/rbalicki2/30e8ee5fb5bc2018923a06c5ea5e3ea5

Basically when deploying the build to the s3 bucket, you can simply rename the .html files to have no .html suffix, ex: www.bucket.com/about.html -> www.bucket.com/about and now both SSR & CSR routing work as expected.

The resulting files have Content-Type: text/html despite not having the suffix, I don't know if this is problematic or not.




回答2:


RewriteRule ^([^.]+)$ $1.html [NC,L] worked fine (y)



来源:https://stackoverflow.com/questions/57438566/next-js-export-static-s3-routing-fails-on-page-reload

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!