LoginSignup
5
8

More than 5 years have passed since last update.

お天気ババアをリッチにした話

Last updated at Posted at 2017-01-26

こちらのお天気ババアbotを改良しました。
http://qiita.com/bbq-all-stars/items/4792c2443dbb6ecb777c

スクリーンショット 2017-01-26 19.41.47.png

ババアをリッチに表示しました。
ついでにSlackのデフォルト投稿チャンネルを設定して、前チェック時から雨のステータスに変化があった場合に、投稿チャンネルに自動でババアが通知をするようにしました。

ババアは降雨強度に従って全9種類 + エラー文言1種類
スクリーンショット 2017-01-26 19.14.49.png

Githubにもあげた。
https://github.com/bbq-all-stars/RainBBA

ババアの機能

  • Slackの公開チャンネルならどこでもコマンド一つで雨が降っているか教えてくれる
  • 雨のステータスに変化があったら、設定したチャンネルに通知をしてくれる
  • ステータスに応じてババアの態度が変わる
  • ステータスに応じてババア横のバーの色が変わる
  • (コマンド) list ってやると全ババアを表示してくれる
  • エラー時にはエラーメッセージと共に罵倒される

使い方

  1. code.gsをGoogle Apps Scriptにあげる
  2. Google Apps Scriptを「ウェブアプリケーションとして導入」する
  3. ここでSlackのアクセストークンを取得
  4. 前工程で得られたウェブアプリケーションのURLを、SlackのOutgoing Webhooksに設定。同時にババア起動コマンドを決める。ここでは「rain?」にしている。
  5. Outgoing Webhooksのトークンを取得
  6. YahooのAPIのトークンを取得
  7. Google Apps Scriptのプロジェクトのプロパティに、下記のパラメータを追加する
  8. おもむろにSlackの公開ちゃんねるでババアを起動コマンドを叩く

設定値一覧

プロパティ名 説明
SLACK_ACCESS_TOKEN Slackのアクセストークン
OUTGOING_WEBHOOK_TOKEN Outgoin Webhookのトークン
YAHOO_API_TOKEN YahooのAPIトークン
DEFAULT_COODINATES デフォルト観測場所
DEFAULT_WEATHER_CHANNEL デフォルトで投稿するのSlack公開チャンネル

地味にハマった箇所

SlackのpostMessageの画像表示

今回ババアをリッチに表示するにあたって、画像をLineのスタンプみたいに表示出来ないかなー、と考えてました。
最初はメッセージ本文に画像のURLを入れて、Slackの自動プレビュー機能でやってたんですけど、なぜかたまに画像が表示されないことがある。
スクリーンショット 2017-01-26 20.17.19.png

直近で同じ画像があるとどうやらプレビューが表示されないらしい。
ということで、何か方法はないかと探すと、今回使ってるGASのライブラリが使っているSlackのWebAPIに、attachmentsっていう設定項目があって、そこにimage_urlって項目があるじゃありませんか。
そこで前出のGASのライブラリを使ってこうやってみた。

postMessage
  var app = SlackApp.create(SLACK_ACCESS_TOKEN);
  app.postMessage(
    channelId, 
    "",
    {
      username: botName,
      icon_url: icon,
      attachments: [{
        pretext: "",
        image_url: icon,
      }],
    }
  );

...動かない。
てっきりattachmentsの書き方が間違っているのかと思って、MessageBuilderで試すと動く。
で、ライブラリのソースコード読んだり、色々いじったりしてもなぜか動かなくて、おかしいなとSlackのAPIのドキュメントを読んでみたらこんな記述が。

  • For the Web API, include an attachments property, containing a JSON-encoded array of attachment hashes.

ん?もしかしてと思ってattachmentsをJSON.stringifyしてみる。

postMessage
  var app = SlackApp.create(SLACK_ACCESS_TOKEN);
  app.postMessage(
    channelId, 
    "",
    {
      username: botName,
      icon_url: icon,
      attachments: JSON.stringify([{
        pretext: "",
        image_url: icon,
      }]),
    }
  );

スクリーンショット 2017-01-26 20.32.51.png

やったぜババア

attachmentsはJSON.stringifyしないといけないみたいです。
ちなみにimage_urlだけ指定しても画像が表示されなくて、pretextに空文字を指定する必要があった。

ちなみに

会社のSlackで#weatherチャンネル作ってやってたんですけど、ババアをリッチ表示にしたら何人かチャンネルを抜けました。

5
8
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
8