404 Error when trying to install app using the "Add to Slack" button on the Distribution tab

[T-Roth]

Ngrok is reporting that I'm getting a 404 when trying to install my app using the "Add to Slack" button on the Distribution tab? Does the app need to respond to a certain event to use the "Add to Slack" button or am I missing some configuration option somewhere? I'm able to install the app to my workspace from the App Directory within the Slack app.

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

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

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

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

This is what ngrok shows for the request

[seratch]

OAuth flow is not yet supported in Bolt for JS. #479 is going to add the feature. If you're in a hurry to support OAuth flow, take a look at the primitive package in node-slack-sdk. https://slack.dev/node-slack-sdk/oauth

[T-Roth]

I tried following https://slack.dev/node-slack-sdk/oauth. By installing the @slack/oauth package and setup the InstallProvider with the following code:

    const installer = new InstallProvider({
      clientId: process.env.SLACK_CLIENT_ID!,
      clientSecret: process.env.SLACK_CLIENT_SECRET!,
      authVersion: "v2",
      stateSecret: "my-state-secret",
      logLevel: LogLevel.DEBUG,
    });

    let express = (<any>app).receiver.app as Express;

    express.get("/slack/oauth_redirect", async (req, res) => {
      await installer.handleCallback(req, res);
    });

I see the call make it into the handleCallback method, but after that I'm getting a error:

"JsonWebTokenError: jwt must be provided

Any ideas?

[stevengill]

@T-Roth looks like a bug in the OAuth package. I'm going to file an issue for it shortly here.

[stevengill]

@T-Roth for now, you can setup a /slack/install route in your app following the example code at https://github.com/slackapi/node-slack-sdk/blob/master/examples/oauth-v2/app.js#L42-L54.

This will create a custom Add to Slack button for your app which you can embed and share.

The manage distribution Add to Slack button is missing state parameter. So I'm looking into seeing if the OAuth library can/should support that.

[T-Roth]

I got it mostly working when I generate my own install url. But what should happen to the page after I click the "Allow" button?

Currently I see the following; and after clicking "Open" the Slack app opens and takes me to my app, but the page is still there with the spinner on the "Allow" button. Should that page close or redirect, or do something?

[stevengill]

@T-Roth that is our default success handler which redirects back to the slack app. It is expected that you would close that page.

I'll see if we can add an initial web redirect first that would maybe give the user a better visual before redirecting to the native app.

[stevengill]

@T-Roth I've gone ahead responded to the "Add to Slack" from "Manage Distributions" issue. See: slackapi/node-slack-sdk#1009 (comment)

TLDR: We decided the oauth library is not going to support the "Add to Slack" button from "Manage Distributions" due to security.

[stevengill]

@T-Roth sent a PR adding adding a success tab which handles the slack app redirect. Better experience for the users. slackapi/node-slack-sdk#1011

[T-Roth]

I had a user who doesn't have the desktop version of Slack test the install button, They page just sits there with a spinner on the allow button. Shouldn't it take them to the website version of Slack?

[stevengill]

@T-Roth there is no way to for the redirect to determine if a user has the desktop version installed or not. For this library, we decided the best default behavior is attempt to open the app. But if you want a different experience (Say opening browser version instead), then you would have to override the built in success callback and provide your own success callback. See https://slack.dev/node-slack-sdk/oauth#handling-the-oauth-redirect

[KazuAlex]

According to #479, i've tried to use the oauth workflow provided by this library. But its not working as expected. When slack redirect user to /slack/oauth_redirect, the app return 404....
You can found my code here : https://github.com/KazuAlex/openpollslack/blob/v2.0.0-beta1/index.js

[stevengill]

hey @KazuAlex!

I believe you are missing stateSecret when initializing App. Also, I noticed you are passing in authorize. I recommend removing this as it will throw an error when using the built-in OAuth library. You also don't need installerOptions as you are pretty much just using the default values for those.

Lastly, make sure you do have the latest bolt. I've found that sometimes removing package-lock.json is needed to make sure you get the latest.

[KazuAlex]

Thanks @stevengill for your response.
Already have 2.1.1 !

Your solution works. I probably misunderstanding the doc.
Thanks again !