Documentation
Providers
Slack

Slack Provider

slack-logo

If you need a detailed guide on how to setup a provider pleaser refer to the Getting Started and Making your first integration guides.

Important notes

  • Only accepts https domains as redirect_uri.
  • scope property are for the bot, use user_scope for scopes specific to the user.

Resources

Setup

Callback URL

https://your-app.com/api/auth/integration/slack

Environment variables

.env.local
AUTH_SLACK_ID=your-client-id
AUTH_SLACK_SECRET=your-client-secret

Add the provider to the auth.ts file.

auth.ts
import { NextIntegrate } from 'next-integrate';
 
export const { auth } = NextIntegrate({
  // The URL of the app, e.g. https://example.com, set in the .env file.
  // If you want to modify the redirect URL, to be prefixed with something else,
  // you can do it here like this:
  // base_url: process.env.BASE_URL! + "/some-prefix",
  // This will change the redirect URL to eg. https://example.com/some-prefix/api/auth/integration/google
  base_url: process.env.BASE_URL!,
  providers: [
    {
      provider: 'slack',
      client_id: process.env.AUTH_SLACK_ID!,
      client_secret: process.env.AUTH_SLACK_SECRET!,
      integrations: [],
    },
  ],
});

Add an integration

auth.ts
import { NextIntegrate } from 'next-integrate';
 
export const { auth } = NextIntegrate({
  // The URL of the app, e.g. https://example.com, set in the .env file.
  // If you want to modify the redirect URL, to be prefixed with something else,
  // you can do it here like this:
  // base_url: process.env.BASE_URL! + "/some-prefix",
  // This will change the redirect URL to eg. https://example.com/some-prefix/api/auth/integration/google
  base_url: process.env.BASE_URL!,
  providers: [
    {
      provider: 'slack',
      client_id: process.env.AUTH_SLACK_ID!,
      client_secret: process.env.AUTH_SLACK_SECRET!,
      integrations: [
        {
          name: 'some_custom_name',
          options: {
            scope: '',
            user_scope: 'openid identity.email',
          },
          callback: async (data) => {
            // This is where you can save the data to a database, or do something else with it.
          },
        },
      ],
    },
  ],
});

Usage

To use the your new integration, you can use the <Integrate /> component found in the Getting Started Guide.

import Integrate from '@/components/integrate';
 
export default function Home() {
  return (
    <main>
      <Integrate provider="slack" name="some_custom_name">
        Get Slack User Info
      </Integrate>
    </main>
  );
}

Options

You can pass various parameters on the options object to customize the integration. The parameters are specific to the Slack provider, please refer to the documentation (opens in a new tab), to verify the information if needed.

parametertyperequireddescription
scopestringtrueA list of URL's that determines what the user will be prompted to give access to. You can parse multiple scopes by seperating with a space. You can find the full list of scopes here (opens in a new tab).
user_scopestringfalseThe scope list requests scopes for your app's bot user. If you have specific need for a user token (for example, so that you can act on behalf of a user), provide a user_scope parameter with requested user scopes instead of, or in addition to, the scope parameter.