Every day so many people depend on slack to stay updated in their daily life. Hence, we may need to deliver some message or an alert to slack programmatically via an API in our product or webapp. This is a simple guide to show how you can achieve the same with no coding, to quickly hook up slack with your webapp.
Our goal is to create an endpoint that we can trigger to send our message on the slack.
-
We head over to Canonic and sign in using our social accounts. Next, we click on Create New to create a project for our application. Click on next, then click on create to complete the process.
Create new project screen
-
A popup asking your first table name will appear. If not, you can click on the + icon in the header to create a new table. Let's name our first & only table for this project as Messages.
-
We create a text field named "Message" as we'll need it in the API & also to store the messages we send out.
We hit deploy on the top right, and we'll be provided with a hosted backend. a database & basic CRUD endpoints per table to help us create an API for our slack.
-
Click on the API tab on the left to start adding the slack webhook. We select the createMessage block in mutations. Click on the + button. It'll open up a new webhook settings on the right hand side.
Select Message type → Choose Slack from the list of providers & you'll be provided with 2 fields for settings.
Trigger URL → This is the url which will be generated by slack
-
Message Body → Message to send to slack channels.
For Trigger URL → You'll need to create a webhook endpoint on Slack. Follow the slack documentation to help you through - https://api.slack.com/messaging/webhooks. After you complete this guide, you should have a slack webhook endpoint, something like this - https://hooks.slack.com/services/xxx/xxxx/xxxxx
For Message Body → We want to send the text found in the message field of the API to slack. So we can make use of Handlebars templates & simply write
{{message}}
in that field. This will extract the message field from the API payload and forward it to slack.
The above concludes the setup for the API that was required. Now let's start using this API to start sending messages to our slack channels.
Triggering Slack API:
This will require a combination of things that we need for securely connecting our application with this API.
- Access token for our API
- Documentation for the API
Access Tokens
-
Click on Settings using left side menu. Go to Access tokens tab.
-
Click on Create a new token, and provide it a suitable name and permissions. Click on Create.
-
You've successfully generated an access token for your API. Copy it & save it some place safe as you won't be able to see it again.
Documentation
Head over to the docs tab using the left-hand side, and you'll find documentation for createMessage API (the API block where we added our webhook).
Testing
After completing all the necessary steps, we're finally ready to deliver our first message to the slack using API.
- Let's copy the CURL command that was mentioned in the documentation. Fill in your access token and paste it into the terminal.
-
Our curl command will look something like this.
➜ ~ curl 'https://xxxx.hem.canonic.dev/api/messages' \ --request POST \ --header "Content-type: application/json" \ --header "Authorization: xxxxxx-xxxxx-xxxx" \ --data '{ "input": { "message": "Hello Slack! How are you?", } }'
A successful response will look like this:
{"data":{"message":"Hello Slack! How are you?","_id":"60bf30ee2529700009fd2a4a","createdAt":"2021-06-08T08:57:18.316Z","updatedAt":"2021-06-08T08:57:18.316Z","__v":0,"id":"60bf30ee2529700009fd2a4a"},"error":null,"success":true}%
And just like that, we can setup an alerting or notification system for slack. You can also add more fields apart from message like name. This will allow you to formulate a much better structured in message body.
Hi {{ name }},
My message - {{ message }}
Thanks
Find detailed documentation for this feature here - https://docs.canonic.dev/concepts/webhook-providers/slack
Also checkout how we can integrate 3rd party authentication services with your backend without coding here. Looking forward to your feedback!
Top comments (0)