Cognito Hosted UI serving broken assets

Here are the recommended steps to diagnose and resolve the 404 errors for JavaScript and CSS assets:

1. Verify Cognito User Pool Configuration: Ensure that the Cognito User Pool configuration for the hosted UI is correctly set up. Misconfigurations here could lead to incorrect asset paths.
2. Check CloudFront Distribution Settings: Verify that the CloudFront distribution for your custom domain is properly configured to serve the correct assets. Check the origin settings and behaviors to ensure they are correctly routing requests to the Cognito User Pool.
3. Review Custom Domain Configuration: Confirm that the custom domain is correctly set up in Cognito, including any necessary validation and SSL/TLS certificates.
4. Inspect Asset URLs: The “null” values in your asset URLs typically indicate a misconfiguration or a missing value somewhere in the setup. Ensure that all relevant environment variables, configuration settings, and URLs are correctly specified.
5. CloudFront Caching Issues: Sometimes, CloudFront caching can cause issues with asset loading. You might need to invalidate the cache to ensure the latest assets are served correctly.
6. AWS CloudTrail and CloudWatch Logs: Utilize AWS CloudTrail and CloudWatch logs to track down where the 404 errors are originating. These logs can provide insights into misconfigurations or routing issues.

Helpful Resources and Links https://docs.aws.amazon.com/cognito/latest/developerguide/what-is-amazon-cognito.html https://docs.aws.amazon.com/cognito/latest/developerguide/cognito-user-pools-assign-domain.html https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/distribution-web-creating.html https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/troubleshooting.html

Further Assistance If you continue to face issues, consider reaching out to AWS Support for more personalized assistance. Support team can provide deeper insights and help resolve any underlying issues that might be affecting your setup.