[DOCKER] Develop a Slack app to survive the corona disaster and improve communication

What I made

[Azure free tier has ended suddenly, so we are migrating. ]

It is a Slack app called "comawari" that communicates with cartoons instead of Slack text messages.

You can open a modal on Slack and choose which image to put the lines on and post.

As of November 2020, we are using image data from the following sites. Say Hello to Blackjack Ghibli

How it works

After Slack's OAuth authentication, we will post comics using the mechanism called Slash Commands and Interactivity.

OAuth If you ask Slack API for the code passed in the redirect URL, you can get an access token, so save it in a secure storage. The redirect URL can be specified on the Slack app management screen.

Slash Commands The comawari API that is hit when the Slash command is executed hits Slack API to open modal.

Post

When the user modally clicks the submit button, the API specified in Interactivity on the Slack administration screen is hit. Use the user's access token that you sent, and post to display the cartoon on behalf of the user.

program

The comawari server is written in Go language.

API We are building an API using a framework called Gin. https://github.com/gin-gonic/gin It is lightweight and easy to use.

Slack integration

From the request data received by Gin, the request is sent to the Slack API via http in the golang standard library. For example, the place to get an access token looks like this.

//Convert the sent code to an access token
values := url.Values{}
values.Set("code", code)
values.Add("client_id", SlackClientID)
values.Add("client_secret", SlackClientSecret)

req, err := http.NewRequest(
	"POST",
	"https://slack.com/api/oauth.v2.access",
	strings.NewReader(values.Encode()),
)

Image drawing

The image drawing of the Kimo of this service is also drawn using the image of the golang standard library. Although it is relatively easy to draw characters, there is no function to write vertically, so the characters are decomposed one by one and drawn by specifying the X and Y coordinates.

This image is a real-time drawing, but it can be drawn at a speed of less than 100ms even with Azure's low spec Virtual Machine. _ Say Hello to Blackjack / Hidemine Sato _

Original image data

For the original image that is the source of the manga, select an image that you can use for free and save it on github together with JSON that defines the text area. When comawari is launched, it is cloned from github and placed in golang on-memory for use. Among them, I want to open the repository so that I can freely add images by pull request.

infrastructure

The server uses Azure's Virtual Machine (Standard B1s) to launch the comawari service with Docker. The Dockerfile looks like this.

FROM golang:1.15.2

ENV TZ Asia/Tokyo

RUN go get github.com/cespare/reflex

WORKDIR /root
RUN mkdir /root/.ssh
COPY ssh /root/.ssh/
RUN chmod 600 /root/.ssh/id_rsa
RUN touch /root/.ssh/known_hosts
RUN ssh-keyscan -t rsa github.com >> /root/.ssh/known_hosts

WORKDIR /data
RUN git clone [email protected]:rspepe/comawari-data.git

WORKDIR /go/src/github.com/rspepe/comawari
COPY src .

EXPOSE 80 443

CMD ["/usr/local/go/bin/go", "run", "/go/src/github.com/rspepe/comawari/main.go"]

The server has been up and running for a few weeks, so it's running for free. Even if the free tier is over, it seems that pocket money is quite good, but if the traffic increases and you can not afford the cost, you will be in trouble.

Local development

I'm using ngrok to get a local machine called from Slack. For how to use it, I referred to another person's article. https://qiita.com/mininobu/items/b45dbc70faedf30f484e

Slack review

In order to publish it as a Slack app, it needs to be reviewed in the same way as the Apple Store. I had to create a landing page to declare a privacy policy and think about user support, which was quite difficult.

Points to be pointed out

Too many Slack permissions required by OAuth

Remove permissions unnecessary for service realization from request permissions.

Allowing users to erase access tokens

Added / deauth_coma command to delete access token when executed. Because there is a risk of deauthorization by pretending to be an email response.

User support

A new / support_coma command was added to build a mechanism for sending messages to me. If you contact us by email, it may be treated as spam and overlooked.

Remaining issues

cost

Since I made a fun service, I would like to maintain it as much as possible, but it seems that it will become difficult to maintain as the server operating cost increases. If that happens, you should also consider monetization. Since it runs in a Docker container, you can take it anywhere in a cheap environment where Docker runs.

Supports parentheses

It does not support parentheses such as "" and []. It seems that it is not necessary to deal with it because it does not appear in the manga frame, but I am considering whether there is a good way to deal with it.

font

It does not support languages such as Arabic and Chinese, and the characters become tofu. I want to find a free font and improve it so that it can be used in various ways.

Export abroad

Although it is only available in Japanese, Slack is used all over the world, so I would like overseas people to use it as well. It seems to be difficult in terms of copyright, but I wish I could do something like Iron Man.

Impressions

I've wanted to do this service for a few years, so it's a great sense of accomplishment. Previously, when I challenged, I used HTML and JS to write text vertically on top of the image. It was successful to steadily improve the development ability of golang and an excellent communication tool called Slack. We will continue to develop, believing that we can continue to improve little by little and make better things.

Acknowledgments

We would like to thank Mr. Hidemine Sato (reported after the fact at the time of publication of this article) who allowed the secondary use in creating this service, and Mr. Studio Ghibli who allowed the use within the scope of common sense. thank you very much.