Custom API Authentication should allow the use of btoa()

https://docs.retool.com/docs/custom-api-authentication
While setting up a REST Resource with Custom Auth using a Form (modal) and API Request flow, I ran into an issues where fields in the API Request form only allow you to inject the exact value from the Form fields. For my case, I need to concatenate the email and password together, separated by a colon, and then base64 encode it.
What I would like to do: Basic {{btoa(form1.email + ':' + form1.password)}}
However this just results in the literal string "null" being used, and it gets sent over as: Basic null

I feel it would be helpful to allow this functionality.

2 Likes

Here the same, I need to concatenate the email and password together, separated by a colon, and then base64 encode it.

Please let me know if you find a solution for this!

Hi :wave:

Unfortunately, we don't support JS in Custom Auth flows, it's a request that's already on our radar but I can't make any guarantees about when it will come to the platform. In the meantime, if you're looking to prepare inputs for your auth you'll have to do it in the app itself using a modal component with inputs and a REST query.

I'll report back here if there's an update on this feature!

@Kabirdas Is JS still not supported in Custom Auth flows? How about in the rest of Resource? We currently need it to base64 encode for Authorization header in Resource and it doesn't seem to be working. Is there a workaround?

Hey @daphne-producepay!

It still isn't supported at the moment, the workaround we typically suggest is to run the auth flow you need through the app itself. Would this resource be use in a large number of apps? It might help to use the query library or preloaded javascript which can help remove some of the need to duplicate code. You can also explore local storage as a way to potentially persist the base64 header for an individual user.

Hi @Kabirdas, this Resource is planned to be used in only 2 apps but it will have quite a few queries, and we'd like to not have to put this header in each query. I don't think query library would help here because most of these queries will be different from each other. Preloaded javascript would mean I would still need to pass this in to the each query? As for local storage, is that accessible from Resource or do I still need to pass it in from the app's query?

Unfortunately, all options would require that you pass something to the header within your app. Adding support for local storage within the resource setup page is also something on the dev team's radar and we can let you know here when that is included as well.

Hi, I am new to Retool having only discovered it today. I started to write a Resource and came across this exact problem with my API that uses a Basic auth request to get a token. I feel like this is a common case that ought to be supported better perhaps?

I'm not sure what else to do here as I am obviously still finding my way around how it all works.

Cheers
Julian.

Hey @jje! Passed along the bump on this issue :slightly_smiling_face: if you let me know any particular blockers you're having with the workarounds mentioned here we can try and work through them together.

Hi there. I ended up creating a modal to log in and store the received token in local storage. This will then have to be used on every component in the application which is not great but at least gets me going for now. I suspect most people would be happy with a b64 encoding function in the login resource rather than full Java!

Hey folks!

Support for JavaScript in Custom Auth flows was recently rolled out to Cloud organizations, this includes btoa() :tada:

Please let us know if you have any feedback on it :slightly_smiling_face: