Search code examples
amazon-web-servicesvue.jsamazon-s3single-page-applicationamazon-cloudfront

Access Denied when requesting route after authentication - AWS Cloudfront and AWS S3


I have a S3 bucket of a Vuejs application with the content shown in the link s3 bucket content

To deliver that content i have a distribution in Cloudfront. To make that distribution secure, i created a OAI to associate into Cloudfront distribution and S3 bucket. ** The distribution origin is the bucket not the bucket domain. So when i request the Cloudfront domain the login page is shown, after click on the login button an OIDC flow is started, and when the Callback router is requested is showed a page with acess denied as the link show acess denied. To try to get around this problem I created a function in CLoudfront that checks the url and renders the index.html, but that didn't work. How can i fix this? Remembering that I don't have a subdirectories with index.html inside them. I have an index.html that loads the js scripts that are built in the vue process


Solution

  • I solved the problem registering an Error pages in Cloudfront distribution, in my case a 403 error code, so when 403 is launched the Cloudfront redirects to index.html, and from there vue knows what do. btw i found the solution here answer