Overview

This article introduces how to post a message into a Slack channel from a Kintone App. When a workflow status of a record is proceeded to "Completed", a script sends a request to Slack's Incoming Webhook. A message including information about the record is then posted into a Slack channel.

Warning

This is a custom webhook implementation using a JavaScript customization. As such, it does not use the native webhook feature.

Scenario

Different database instances within Kintone can cover many scenarios depending on the user's needs. CRMs, Project Management, Interview Notes, Task Lists, Expense Reports, PTO Request Forms are some examples. Kintone Apps tend to result in higher productivity if their Process Management settings have been enabled, which define a streamlined workflow for every record within the database.

Setting up the Connection

Prepare Slack

Create a Slack channel

Create a Slack channel that will receive notifications from Kintone.

Set up an Incoming Webhook

In Slack, create a new App. For this demostration, we created from scratch with all default settings.

After creating the app, navigate to the Incoming Webhooks page.

Activate webhooks using the toggle.

Finally, click the Add New Webhook button, select a workspace and channel to post to, and click the Allow button. A sample curl command, and the Webhook URL will be displayed.

Take note of the URL displayed in the Webhook URL settings, as it will be used in the next step.

Prepare the App

Create the form

Create an App with the following fields.

Set the Process Management settings

In the settings of the App, navigate to App Settings, then to Process Management. Check the "Enable process management" checkbox. Set the following Status for the Status Settings.

Set the following settings for the Process Flow Settings

Save the settings, and click on Update App to apply the changes to the Kintone App.

Sample code

Prepare the following JavaScript code in a text editor and navigate to the Kintone App's settings. Replace {subdomain} and {IncomingWebhookURL} with the necessary values. Upload the file into the Upload JavaScript for PC option of the JavaScript and CSS Customization settings .

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

(() => {
  'use strict';

  const subdomain = '{subdomain}';
  const webhookUrl = '{slackWebhookURL}';
  const fieldCode = 'taskname';

  kintone.events.on('app.record.detail.process.proceed', async (event) => {
    if (event.nextStatus.value === 'Completed') {
      const thisUrl = `https://${subdomain}.kintone.com/k/${kintone.app.getId()}/show#record=${kintone.app.record.getId()}`;
      const payload = {
        text: `"<${thisUrl}|${event.record[fieldCode].value}>" has been completed!`
      };

      try {
        await kintone.proxy(webhookUrl, 'POST', {}, payload);
        console.log('Success');
      } catch (error) {
        console.log(error);
      }
    }
    return event;
  });
})();

After saving the settings and clicking on Update App, add a new record into the App. Proceed the Status of the record to "In progress", then to "Completed".

An event should be triggered, resulting in data being sent to Slack's webhook. Check the Slack Channel to see if a message has been posted.

Reference

• app.record.detail.process.proceed
• Slack: Incoming Webhook