I am building an application that has a frontend (nuxt3) and a backend(nodejs/adonisjs). So far they both work in perfect harmony.
Now, the frontend applications needs to display and resize images of the products, so I've setup a new service, the imgproxy docker image. Everything worked perfect until I've added a key and a salt to verify the urls signature.
I don't understand how I should setup my applications so I can use the imgproxy image.
I generate the signature from the frontend application? - I tried that, it's not easy to do that and as per my readings it's not really recommended.
I generate the signature from the backend application? - I tried that, I can generate the signature from the backend, but the problem is, in the backend I don't know the sizes asked by the frontend. Do I make a standard list of image sizes that I need and for each I generate a signature?
My question is, what it's a recommended way of setting up the imgproxy to be used securely. It's not clear to me how to build the infrastructure so that the frontend can talk to the imgproxy and ask for different sizes images and in the same time the urls to be signed so that the imgproxy won't be abused.
How the infrastructure for this looks like? What are the implementations I need to do? What other software I need to use, how to use them? It's really unclear for me this part.
Can someone give me some practical advises on how to setup the frontend, backend and imgproxy to work together?
