Subpage cannot be loaded directly from remote deployment

Hello, I have create a streamlit application and run without any issue when run locally with streamlit run. But when I deploy it to AWS (Route53+CloudFront+ALB+ECS), it has an issue open sub pages.
The issue was if I open the main page, for example abc.com, everything works fine even if I navigate to subpage from the main page.
But when I open directly with abs.com/subpage, it will hanging at skeleton elements forever and calling 304/health in a loop from background. I tried to follow this post: App is not loading when running remotely - Streamlit Docs and disable the CORS/enableXsrfProtection/enableWebsocketCompression but none of these fixed my issue. Wondering if there is anything I missed. Thanks!

Same issue as Issues with Multipage Access in Cloudfront