Bolt-js: binding slack user to my app users

[MarwaAbuEssa]

Description

HI ,

I'm using you slack/bolt v1.5 to create a slack pp with home tab and i'm using slack user id from 'app_home_opened' event to publish home tab and also open model .....etc . now to get data from my web app database i need to bind my web app user with slack user . i thought to do the binding while installing slack app ( for example : like google drive slack app installation opened a url for me to authenticate and login by google account) . the issue is that i read about your Outh flow 1- at first when user installs slack app it will send a temp code expires in 10 mins to the predefined redirect_url which will request authorize access to grant an access code .

my question is how to handle a custom url (like the one of google drive ) to users who installs my slack app in order to bind both slack and my web app user's account .

waiting your reply .

Regards,
Marwa

What type of issue is this? (place an x in one of the [ ])

• [ ] bug
• [ ] enhancement (feature request)
• [x] question
• [x] documentation related
• [ ] testing related
• [ ] discussion

Requirements (place an x in each of the [ ])

• [x] I've read and understood the Contributing guidelines and have done my best effort to follow them.
• [x] I've read and agree to the Code of Conduct.
• [x] I've searched for any related issues and avoided creating a duplicate issue.

---

Bug Report

Filling out the following details about bugs will help us solve your issue sooner.

Reproducible in:

package version:

node version:

OS version(s):

Steps to reproduce:

1.
2.
3.

Expected result:

What you expected to happen

Actual result:

What actually happened

Attachments:

Logs, screenshots, screencast, sample project, funny gif, etc.

[MarwaAbuEssa]

any help please ?

[seratch]

I'm still not 100% confident if I understand your question yet but I assume that your question is about how to bind a Slack user and the same person's account for another service.

The request_uri of your app handles the redirection with a code parameter from Slack. The endpoint verifies state parameter and then calls oauth.v2.access or oauth.access API to complete the installation & acquiring a bot token and the installing user's user token. After completing these, the endpoint can decide where to navigate the user.

The common pattern would be the endpoint redirects the user to the thank-you page. But if your app has additional steps like asking the user to do an OAuth flow with other services, you can do it as the next step. Another endpoint that handles OAuth callback requests from the service can bind the two accounts (Slack user account & another service account) in a same row in your database.

Does that answer your question?

[MarwaAbuEssa]

Thank you so much , yes I got the complete flow now but can i ask you about the stateparameter i'm getting at the request_url it is like https://xxxxxxx/auth/login?code=xxxxxxxxxxxxxxxxxxxxxxxxx&state= it is empty ! , is there anything i'm missing for app setting which make state parameter empty ??

Thanks a lot for your help

Regards ,
Marwa

[artgillespie]

I've only ever seen the state parameter empty on the callback when it wasn't passed as part of the authorization url.

Did you set the state query parameter when you originally sent the user to https://slack.com/oauth/authorize?

e.g.,

const installURL = `https://slack.com/oauth/authorize?client_id=${clientID}&scope=bot,chat:write:bot?redirect_uri=https://app.trainify.io/slack/auth/callback&state=${userID}`

After successful installation, that results in my app getting a request at /slack/auth/callback?code=xxxx&state=USER_ID

[MarwaAbuEssa]

hi ,
I'm adding redirect_url from OAuth & Permissions tab at https://api.slack.com/apps/xxxxx/oauth? page , so when the user using add to slack button at app directory or when i use install app from workspace button , it open the redirect_url i set from OAuth & Permissions tab like https://xxxxxxx/auth/login?code=xxxxxxxxxxxxxxxxxxxxxxxxx&state= with the empty state !!! i means i'm not setting the installURL it is generated by slack !!.

Thanks ,
Marwa

[stevengill]

Hey @MarwaAbuEssa,

I believe when a user is adding your app via App Directory, there is no state.

[seratch]

@MarwaAbuEssa
As you mentioned, the URL generated in the Slack App configuration page doesn't have a state parameter and for Slack OAuth. It's okay to use the URL as-is.

But, in general, implementing the state parameter verification is recommended. So, for a better implementation, I recommend having an entry point of your Slack app OAuth flow like https://your-doman/slack/installlation that redirects installers to https://slack.com/oauth/v2/authorize?client_id=123.123&scope=chat:write,commands&state=the-value-you-generated-for-this-request. Then, your rediect_uri verifies if the-value-you-generated-for-this-request is valid.

[MarwaAbuEssa]

hi @seratch

can i ask you if i want to add my slack app via app directory (not from my custom installation page ) how to set that state param ? because as i understood from you this param is recommended to be added .

Thanks ,
Marwa

[stevengill]

Hey @MarwaAbuEssa,

If you want to distribute your app through the App Directory, you can't set the state param. The state param isn't recommended to be added through the App Directory. So you don't have to worry about it in that scenario.

[seratch]

@MarwaAbuEssa

As Steve mentioned, having the state parameter is not mandatory for directory apps at the moment, but I'm happy to know you're going to implement it for your app! Let me answer your question below.

can i ask you if i want to add my slack app via app directory (not from my custom installation page ) how to set that state param ? because as i understood from you this param is recommended to be added .

The Slack App configuration page provides your app's slack.com/oauth/v2/authorize (or slack.com/oauth/authorize for classic apps). It doesn't have the state parameter because the value should be unique per request.

A common way to support the state parameter would be having a kind of entry point of your Slack app OAuth flow as below.

• [Step1]: (Your App) The OAuth flow entry point: https://your-domain/slack/installation
  
  
  
  • You set this URL to Basic Information > Installing Your App > Install from App Directory > Direct install URL (also, if you use the Add to Slack button link, modify the URL the button links to)
  
  
  • This endpoint generates https://slack.com/oauth/v2/authorize URL with client_id, scopes, and state parameters
  
  
  • This endpoint stores the state value on the server-side
  
  
  • This endpoint redirects a user to the generated URL
  
  
• [Step2]: (Slack) https://slack.com/oauth/v2/authorize
  
  
  
  • Slack server redirects the user to Slack's OAuth confirmation page
  
  
• [Step3]: (Slack) The user confirms the installation on the page
  
  
  
  • Slack server redirects the user to your redirect_uri under https://your-domain
  
  
  • The redirection adds two query params to the URL - code and state
  
  
• [Step4]: (Your App) redirect_uri (say https://your-domain/slack/oauth/callback)
  
  
  
  • This endpoint verifies the state parameter first
  
  
  • Then, this endpoint calls oauth.v2.access (or oauth.access) with the code parameter
  
  
  • Lastly, this endpoint redirects the user to your app's landing pages
  
  
• [Step5]: (Your App) completion/cancellation pages

I hope this guide is helpful to you. If it's clear now, would you close this issue? Thanks for asking questions here. I'm sure this thread will be helpful for others too!

[MarwaAbuEssa]

HI @seratch

Thank you so much for this clarification and also for all awesome replies i got from others . and yes I hope this thread help Others too . Thanks again your support is really fantastic .

[shem8]

Great thread and great explanation @seratch , thank you for that.
But maybe it's a good idea to make the state optional on the handleCallback? Per slack documentation, this should be optional and their "Add to slack" button doesn't pass any state (even if I set Direct install URL)

[sagar-ranglani]

Is this simpler to do now in boltjs 3.1?

I too wish to:

1. bind slack user to my app's user (my app is the oauth2 provider)
2. save my app's access tokens for future use (best would be store in a database like DynamoDB)
3. Do everything in one boltjs app including handling oauth2 redirection to store access tokens.

Any help in this regard would be highly appreciated. Any doc that explains this would be awesome! Thank you very much.