I'm learning to build a "product" from idea to deployment and I have a user profile picture url that contains an API key (abstract api avatar, fwiw) for the image source. Is there any way to obscure that once I use it via the front-end?
Hiding API Key in Img Src URL?
Nic FitzGerald (they/them)
・1 min read
Discussion (4)
It’s in the frontend anyway. So there will never be a secure way of hiding anything in there.
The api key stored/used in the client side should be bound to the fingerprint (e.g. ip + User Agent) of the current session and be only valid for a certain amount of time.
Except from that, you cannot do a lot...
Try looking into signed URLs, where your server has the secrets configured and can generate unique URLs for your clients/browsers. Your implementation will depend on your file/image storage (AWS S3, your backend filesystem, etc.)
Edit: whoops!.. I had a type-o! I've updated my post with "your browser" to "your server" - very important, all things considered!
@nicfitzgerald , I had to edit my post... I hope I didn't cause too much confusion!
Does OAuth help for your case? It is commonly used for authorization.