0

Is there away for me to create dynamic backend routes? I am creating and image host. I am wanting the user to be able to get their image saved on the server under a domain like this http://localhost/<random_id> and example of the link would be http://localhost/a3Fafght5, I have looked around online and I could not find anything about creating dynamic backend routes and then when I did find one thing it said I needed to use getStaticPaths to declare all the possible ids. I dont know what the id is going to be when I build the project, I need to be able to query the database with it and check if it exists and do things from there.

Tyrao
  • 41
  • 1
  • 1
  • 6
  • _I need to be able to query the database with it and check if it exists and do things from there._ - You know what is needed to be done! – Rayon Nov 03 '21 at 07:55
  • I know what I need to do after I have the id but I am not able to get the id dynamically. From my understanding I can create an endpoint under ```/api/images/``` something like that but I need to be able to do it at the root of the site. – Tyrao Nov 03 '21 at 07:57
  • You should be using `getStaticPaths` and accessing all/most of your IDs from an external source like a database. You may use the `revalidate` property that will keep on updating the dynamic routes based on the interval duration you have specified. – Rayon Nov 03 '21 at 08:02
  • You can create dynamic API routes (from `pages/api/` folder) and map them with [`rewrites`](https://nextjs.org/docs/api-reference/next.config.js/rewrites) so that they can be accessed from the root of the website. Note that this will conflict with potential pages that are also on the root. – juliomalves Nov 03 '21 at 19:38

1 Answers1

0

You can use dynamic page routing if you have file like pages/[imageId].js and then simply put getServerSideProps in your file which can call your database and determine if this is valid ID or not. For valid ID your would return image, for not valid simply 404.

If you don't want to have server-side rendering, but static one instead. You could have the same file as above and have getStaticPaths function which would query the database and return array of all possible IDs. This however could be issue if you have a lot of images, then the server-side solution would be easiest.

Mario Nikolaus
  • 2,346
  • 1
  • 21
  • 28
  • _This however could be issue if you have a lot of images_ - Not really, you can return top N IDs in `getStaticPaths` and set [`fallback: blocking`](https://vercel.com/docs/concepts/next.js/incremental-static-regeneration#generating-paths), when a request is made to a page that hasn't been generated, Next.js will server-render the page on the first request. – Rayon Nov 03 '21 at 09:25
  • This is what I am trying to do but how would I use getServerSideProps to query my database so see if it is valid? This sounds like exactly what I am trying to achieve just looks like I am not sure how I would go about it. – Tyrao Nov 03 '21 at 10:45