I'm managing an organization's retool account with several different applications. The applications use API resources with a custom authentication flow. Recently the organization added recaptcha token to their authentication endpoint as an extra security measure which broke the API resource authentication on Retool.
Our API resource authentication flow looks something like this:
- Prompt a modal with username/password
- Call organizations authentication API using username and password AND recaptcha token to get a jwt and refresh token
- Save jwt and refresh token from the response in step 2 and use in the headers for the resource.
Here's how I was imagining step 2 from above would work in Retool's resource authentication interface:
In our react application we are using the following package to create a recaptcha token:
I was thinking that in order to pass the recaptcha token in this step, that I would run some preloaded javascript from the organization's advanced settings, where it would store the generated recaptcha token on the window. I was running into a couple problems trying to set this up.
- I'm not sure where to find a bundled / minified version of this package on a CDN. Is there a recommended way to make a browser friendly version of the package?
- I'd be curious if I'm even on the right track with how to setup the javascript to store the token so that my organization resources can access it. I put an example snippet of what I'm thinking below. I'll be able to test myself once I get step 1 figured out, but would take any feedback if I'm off track!
const RecaptchaV3 = window.RecaptchaV3;
RecaptchaV3.load('<site key>').then((recaptcha) => {
recaptcha.execute('login').then((token) => {
window.recaptchaToken = token;
});
});
Any help would be greatly appreciated 
Brad
