0

I'm looking for a solution that would allow you to go to:

example.com/users/_example_user_123

Where _example_user_123 is a variable (there could be thousands of users), so it's not practical to create a page for it.

Can this be done on a static site hosted on S3/Cloudfront with a serverless backend.

The issue seems to be that when you visit any route for which there is no page, you get redirected to the index.html, and I don't know if there is a way to pass through the initial route request via S3/Cloudfront. Has anyone successfully done this?

I tried using Nuxt, but I can't get dynamic routes working unless the site is not being hosted from S3.

1 Answer 1

0

S3 hosting is a hosting for Static Pages, what automatically disallow implementation of Universal mode for Nuxt.js. You can either deploy SPA or Generated pages on the S3.

Vue.js uses Single Page Application mode (SPA) to generate and create the app. This mean, that the app is accessed using index.html and uses hash-based routing (client-side rendering only). You can read about it here: HashRouter vs BrowserRouter

Luckily enough, Vue.js supports a dynamic route matching, which can be achieved by implementing Vue Router in the way described here: https://router.vuejs.org/guide/essentials/dynamic-matching.html

2
  • 1
    So the short answer is "no"? I was already aware that you can get it working with the router in hash mode. Mar 25, 2020 at 16:33
  • If you use pure S3, then you have to use Vue router. If you use CI tool like AWS Amplify, you can setup redirections. Regardless, it's better practice to keep all in-app redirections in the Vue Router instead. Mar 25, 2020 at 16:41

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.