Cannot use custom HTTP routes with parameters or query strings

[albarivas]

Description

When I try to setup a custom HTTP route (the built-in ones) this way:

const { App } = require('@slack/bolt');

// Initialize Bolt app, using the default HTTPReceiver
const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  customRoutes: [
    {
      path: '/oauthstart/:slackUserId',
      method: ['GET'],
      handler: (req, res) => {
        res.writeHead(200);
        res.end('Do something!');
      },
    },
  ],
});

(async () => {
  await app.start();
  console.log('⚡️ Bolt app started');
})();

And I try to reach the HTTP route - for instance with http://my-bolt-app.com/oauthstart/U01T7MJ9RPY, I get the following error:

[INFO]   Unhandled HTTP request (GET) made to /oauthstart/U01T7MJ9RPY

I tried to implement the same using query strings, but I get the same error. Am I doing something wrong or is it a bug? Thanks!

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

• bug
• enhancement (feature request)
• question
• documentation related
• example code 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.

---

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:

Expected result:

What you expected to happen

Actual result:

What actually happened

Attachments:

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

[misscoded]

Hi @albarivas! 👋🏼

Thanks for bringing this to our attention. Currently, there is no support for parameters, but we agree it would make for an excellent enhancement. We'll get to work on introducing this functionality soon and will link this issue when the corresponding PR is opened. Stay tuned!

You mention in the title of this issue being unable to utilize query strings: can you provide the use case/code snippet in which that fails?

[albarivas]

I have just seen your comment and I haven't tried this code, but if I remember correctly:

const { App } = require('@slack/bolt');

// Initialize Bolt app, using the default HTTPReceiver
const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  customRoutes: [
    {
      path: '/oauthstart',
      method: ['GET'],
      handler: (req, res) => {
        res.writeHead(200);
        res.end('Do something!');
      },
    },
  ],
});

(async () => {
  await app.start();
  console.log('⚡️ Bolt app started');
})();

And then trying to do http://my-bolt-app.com/oauthstart?slackUserId=U01T7MJ9RPY was giving to me the same Unhandled HTTP request (GET) error

[bsonmez]

is there any process?

[zimeg]

Hello all! Meant to return to this soon after the changes in #1785 were released, but happy to share that this is now possible!

Using v3.13.0 or later, you can add custom routes with dynamic route parameters, and use those parameters, as follows:

const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  customRoutes: [
    {
      path: '/oauthstart/:slackUserId',
      method: ['GET'],
      handler: (req, res) => {
        res.writeHead(200);
        res.end(`Hello ${req.params.slackUserId}!`);
      },
    },
  ],
});

Which should return Hello U0123456789 when visiting http://my-bolt-app.com/oauthstart/U0123456789!

Collecting query strings from http://my-bolt-app.com/oauthstart?slackUserId=U01T7MJ9RPY is also possible, but requires checking the req.url string. The same outputs can still be achieved by adjusting the code in the handler like so:

const app = new App({
  token: process.env.SLACK_BOT_TOKEN,
  signingSecret: process.env.SLACK_SIGNING_SECRET,
  customRoutes: [
    {
      path: '/oauthstart',
      method: ['GET'],
      handler: (req, res) => {

        // Gather parameters from the URL
        let urlParams: URLSearchParams = new URLSearchParams();
        const params = req.url.split("?");
        if (params.length > 1) {
          urlParams = new URLSearchParams(params[1]);
        }

        // Collect the `slackUserId` if it exists
        const userId = urlParams.get("slackUserId");
        res.writeHead(200);
        res.end(`Hello ${userId ?? "world"}!`);
      },
    },
  ],
});

For more details on how these routes are handled, feel free to check out the docs on custom routes. And also, a huge shout out to @jeffbaldwinjr for handling the implementation of this! It's a really neat feature to be using! 🎉 👏