Just want to verify that it's okay to make a request to some backend service which will provide credentials, keep the credentials in a variable in the code and then pass that variable to another service to authenticate. I know you can't store it in the browser or in the code itself but is there any issue in dynamically generating it to store in a variable to be used for a request? Is it safer to do that in the backend instead or does it not make a difference?
If the context matters- the goal is to connect to a redshift database without having to make any changes to the backend code- only updating the frontend code. The password can be retrieved from the backend but the code to connect to and interact with redshift must be done on the frontend.
It's never safe or secure to use secrets in this manner.
Everything you send to the client is public, no exceptions. Even if you don't store the secret as a variable, it can still be viewed, for example, in the memory profiler and in the network tab of devtools.
Another reason this is unsafe is due to native prototype pollution and modifications. Take me for instance. I have a browser extension I coded that replaces the fetch and XMLHttpRequest functions in the context of the page with "passthrough recording" functions. The appear the same to the outside, even emulating the toString "native code" aspect. However, what they actually do is record everything concerning the request and response while forwarding the data as if they weren't there. While I use this for logging unsafe traffic and debugging, it wouldn't be difficult to turn it into a data scraper for malicious purposes.
The best alternative, if modifying the existing backend code isn't an option. Is to create an entirely new backend service that handles the connection and data streams. Because I promise you, if you send secrets to the client, someone like me, with just a little bit more bad intent will make you seriously regret it.