google
reCAPTCHA
Slack
Slackin

新しくなったSlackinでSlackの招待サイトを作る

この記事は雑談Slack Advent Calendar 2017の1日目の記事です。

slackinはnowで簡単に使うことができるそうですが「やだい!Herokuで運用するんだい!」という御仁もいらっしゃるかと思います。かくいう私もその一人です。ということでReCAPTCHAがついたSlackinをHerokuで運用していきましょう。

あらかじめ以下のアカウントを用意しておき、ログインしておくと良いでしょう(その時にログインしても問題ありません)。
1. Google
2. Heroku

まずslackinのgithubに飛びます。このサイトは後に用があるので開いておくのがおすすめです。
https://github.com/rauchg/slackin

トークン、レガシーになってしまったらしいんですね。古い情報だとこれを探すのに手間取るのが厄介になります(私も更新しないと)。以下のアドレスから取れます。Createで生成してコピーしておいてください。
https://api.slack.com/custom-integrations/legacy-tokens
2017_12_01_レガシートークンジェネレーターモザイクド.png

そして、最初に開いたgithubのサイトの中ほどまでスクロールし赤枠で私が囲っておいたリンクをおもむろにクリックします。

2017_12_01_これ_2_slackin.png

Herokuに飛びます。ログインしていれば以下のような画面にいくはずです。

2017_12_01_heroku.png

項目は以下のように埋めてください
App name:小文字オンリーの文字列(ハイフンも入れられました)
Choose a region:インターネットのネットワーク上United State以外を選ぶ理由はないと思います。メンバーがヨーロッパ中心とか?

App nameはHerokuのサブドメインに使われるのとreCAPTHCAにも使われるのでコピーしておいてください。

GoogleのreCAPTCHAはこちらから取得せよと先程の説明書きにも書いてあります。ご親切にどうも。取得します。
https://www.google.com/recaptcha/intro/

ReCAPTHA設定.png
設定は
Label:わかりやすいものを自分で書く(日本語も通るようです)
Choose tye type of reCAPTCHA:reCAPTCHA V2を選びます。
Domains:この項目で使うSlackのドメインを記入します。 『HerokuのApp nameで指定した名称』.herokuapp.com を指定します。私はここで間違えてSlackのドメインを入れたりしてハマりました。動作するサブドメインを含むドメインを指定してあげる必要があります。
Accept the reCAPTCHA Terms of Service:規約を読んでチェックします。
Registerをクリックすると次のような画面になると思います。

2017_12_01_生成されたReCAPTCHA_モザイクド.png

Site keyとSecret keyをメモしてください。

Herokuに戻って
Config Variables
SLACK_SUBDOMAIN:あなたのSlack Teamのサブドメインを入れてください。
SLACK_API_TOKEN:先程取得したSlackのAPIトークンを入れてください。
GOOGLE_CAPTCHA_SECRET:先程取得したGoogle reCAPTCHAのシークレットキーを入れてください。
GOOGLE_CAPTCHA_SITEKEY:先程取得したGoogle reCAPTCHAのサイトキーを入れてください。

残りは入力必須ではないので入れなくてもかまわないでしょう。
できたらDeploy appをクリックしましょう。

するとデプロイに成功していれば管理画面からAppを見られるはずですが…

2017_12_01_アレッ.png

!?

どうやら設定が間違っていたようです。Google reCAPTCHAのドメインはHerokuのサブドメインを含むドメインである必要があります。
成功すると以下のようになります。

2017_12_01_できた.png

次回の記事はkakunpcさんの雑談Slackの #troom チャンネルにあるBotの話です。どうぞよろしくお願いします。

私のSlackの記事は私のSlack Teamの宣伝を逃れることはできません!
雑談Slackへ是非どうぞ!
http://samezi-but.com/zdnj.html