Custom Keys & Values in OAuth2 Post Request to Token URL

[JoshU]

Hello,

Some OAuth2 flows require insertion of data into headers and bodies of specific steps.

In my current case, that is required to work with the Sharepoint Online REST API using Retool as a Sharepoint Add-In (created via appregnew.aspx, for those stuck with the same issue).

In this particular use case, the post-authentication HTTP POST request to the access token/auth server endpoint must contain additional data in the body of the request.

As far as I can tell there is no way to accomplish this using either the built-in OAuth2 flow or custom auth steps. Am I incorrect, or the ability to modify the headers and body of individual steps in the OAuth2 flow perhaps something that could be added?

I am able to successfully complete the OAuth2 flow described above, and query the Sharepoint Online REST APIs in Postman, as Postman does allow you to modify the HTTP POST request to the access token endpoint.

[PatrickMast]

Hi @JoshU,

Currently, there is no way to modify the headers and body of individual steps in the OAuth2 flow using either the built-in OAuth2 flow or custom auth steps. This is a limitation of the current implementation of OAuth2 in Retool.

In the meantime, you have a few options:

• Use a custom auth step to implement the entire OAuth2 flow yourself. This would give you complete control over the headers and body of each request, but would require you to write more code.
• Use a third-party OAuth2 provider like Auth0. Auth0 provides a wide range of OAuth2 flows, including the ability to modify the headers and body of individual requests.
• Use Postman to complete the OAuth2 flow and then import the request into Retool. This would allow you to use Retool to interact with the Sharepoint Online REST APIs, but would require you to manually complete the OAuth2 flow each time you want to use the APIs.

Hope this helps.

Patrick

[JoshU]

Hi Patrick,

Thank you for the response.

Do you by any chance have any examples handy of implementing OAuth2 workflow via custom auth steps? I'm not afraid to write more code, but I'm not sure how you would, e.g., implement the OAuth2 login redirect or the callback URL (maybe possible to hack a Flow webhook endpoint to do this?).

[PatrickMast]

Hi @JoshU,

Here are some examples of implementing OAuth2 workflows via custom auth steps in Retool:

OAuth2 login redirect:
To implement the OAuth2 login redirect, you can use a custom auth step to make a request to the OAuth2 provider's login endpoint. This request should include the necessary parameters, such as the client ID and scope. The OAuth2 provider will then redirect the user to their login page. Once the user logs in, the OAuth2 provider will redirect the user back to your Retool app with an authorization code.

You can use a Flow webhook endpoint to handle the callback from the OAuth2 provider. The webhook endpoint should make a request to the OAuth2 provider's token endpoint to exchange the authorization code for an access token. Once the webhook endpoint has the access token, it can store it in the Retool user's session.

import requests

def oauth2_login_redirect_auth_step(request):
  """Implements the OAuth2 login redirect auth step."""

  # Get the OAuth2 provider's login endpoint URL.
  login_endpoint_url = "https://example.com/oauth2/authorize"

  # Create a request to the OAuth2 provider's login endpoint.
  login_request = requests.Request(
    method="GET",
    url=login_endpoint_url,
    params={
      "client_id": "YOUR_CLIENT_ID",
      "scope": "YOUR_SCOPE",
    },
  )

  # Make the request to the OAuth2 provider's login endpoint.
  login_response = requests.send(login_request)

  # Return the login response.
  return login_response

OAuth2 callback:
To implement the OAuth2 callback, you can create a Flow webhook endpoint that handles the callback from the OAuth2 provider. The webhook endpoint should make a request to the OAuth2 provider's token endpoint to exchange the authorization code for an access token. Once the webhook endpoint has the access token, it can store it in the Retool user's session.

import requests

def oauth2_callback_webhook_endpoint(request):
  """Implements the OAuth2 callback webhook endpoint."""

  # Get the authorization code from the request.
  authorization_code = request.args.get("code")

  # Get the OAuth2 provider's token endpoint URL.
  token_endpoint_url = "https://example.com/oauth2/token"

  # Create a request to the OAuth2 provider's token endpoint.
  token_request = requests.Request(
    method="POST",
    url=token_endpoint_url,
    data={
      "grant_type": "authorization_code",
      "code": authorization_code,
    },
  )

  # Make the request to the OAuth2 provider's token endpoint.
  token_response = requests.send(token_request)

  # Get the access token from the response.
  access_token = token_response.json().get("access_token")

  # Store the access token in the Retool user's session.
  request.session["access_token"] = access_token

  # Return a success response.
  return {"success": True}

Once you have implemented the OAuth2 login redirect and callback auth steps, you can create a custom auth workflow that uses these steps to authenticate users. You can then use this custom auth workflow in any Retool app.

Now, this is just a basic example of how to implement OAuth2 workflows via custom auth steps in Retool. You may need to modify the code to fit your specific needs.

Hope this helps!

Patrick

[JoshU]

Awesome, thanks!

[PatrickMast]

Welcome!

Patrick