Webhookとは【アプリ連携で自動化を促進】webアプリケーションをもっと便利に

Webフックは、LINEやスラックなどに通知をしてくれるサービス。IT業界で、いま、いろいろなシーンで登場するキーワードの1つ、Webhook。

しかし、Webhook(ウェブフック)って、何?という方もいらっしゃると思います。

今回は、そんなWebhook(ウェブフック)について、まとめてみました!!

Webhookとは

Webhookは、ウェブフックと呼ばれています。

Webhookとは、プログラム上で発生した更新情報を、ほかのアプリケーションに、リアルタイムに通知する仕組みのことです。

わかりにくいので、実例をあげます。

Webhookの例としてわかりやすいのが、Dropboxとslackの連携です。

  • 私が、Dropboxに、ファイルをアップロードします。
  • すると、Dropboxが、特定のSLACKのチャンネルに、ファイルがあがったことを記載してくれます。

このときに、動いている仕組みが、Webhookになります。

要するに、アプリケーション上、何かが起きたときに、その起きた事象をほかのアプリケーションにリアルタイムに伝えてくれるシステムです。

上記は、webフックのイメージを簡単に説明した動画です。webhookとは何かが、わかりやすく解説されています。

ちなみに、さらに。。。専門的な話をすると、

Webhookは、アクションが起きたとき、指定したURLにPOSTリクエストする仕組みのことをさすケースが多いです。

GETリクエストではなく、POSTリクエストなのです。

いままで、アプリケーション連携といえば、GETリクエストを中心とした、API連携がメインでしたが、APIでのやりとりとWebhookでのアプリケーション連携は何が違うのでしょうか?

APIとWebhook 比較

Webhookと、APIを比較してみましょう。

APIは、Application Programming Interfaceの略称です。

APIで有名なものは、facebookやtwitterでのログインができる、ソーシャルログインの機能です。

あれは、たとえば、食べログなどのサイトへのログインが、ツイッターのログインアカウントなどでできる機能ですね。

Googleアカウントでログインするなどもあり、とっても便利です

しかし、APIは、プログラム的には、あくまで、リクエストが先に必要となります。

ユーザーが情報を送って、ログインをリクエストして、からの、レスポンスです。

Webhookの場合は、こちら側のアクションを必要とせずに、レスポンスができます。

先程説明した、dropboxとSLACKの連携では、SLACKには、何もリクエストしていませんが、SLACKに、情報が届きます。

このように、アプリ間での連携で、非常に効率的なのが、Webhookなんですよね。

なぜ、いま、Webhookなのか?

どうして、いま、IT業界で、Webhookが盛り上がってきているのでしょうか?

Webhookが盛況になってきている理由は、

  1. ノーコード、ローコードツールが活況
  2. webアプリケーションが増加
  3. デジタルマーケティングの強化、促進
  4. 働き方改革

上記の4つが、主だった理由だと思われます。

とにかく、Webhookは、デジタルマーケティングツールと相性がいいです。

さまざまな情報の通知、データ送信を自動的にしてくれるからです。

アクセス解析ツールで、1万PVになったら、メールが飛んでくる

これはアクセス解析ツール側で、メール送信の機能が必要ですが、Webhookの機能があれば、メールではなく、slackやchatworkなどと、さまざまなツールと連携できます。

連絡という業務が軽減されるので、そこが便利なんです。メールを書くのに、3分かかるとしたら、それが1日10回不要になれば、1日30分の削減になります。なんだ、30分かぁ。と思うかもですが、一年で考えてください。めちゃくちゃ時間の削減につながります。

とても便利ですし、業務効率化につながります!

これは大きいですよね。

Webhook できること

Webhook できることを簡単にまとめると、

ユーザーは、アプリケーションへのアクション1つで、複数のアプリケーションに通知などができるようになります。

その結果、

  • 何かのアクションをする
  • その内容の通知が自動的にされる

ということができます。

ネットを考えずに、普通の業務で例えてみます。

  • 企画書を作りました。
  • それを、上司に確認するために、上司に伝えます。

この2つのアクションのうち、下のものを自動的にしてくれるのが、ウェブフックのできることなんですよね。

1つのアクションがまるまる不要になるのです。

この例であれば、上司への報告で、細かいメールを書く必要もありません。

それゆえ、

  • 速い
  • 誰でもできる

ということが現実になります。

とはいえ、現実社会で、この運用をするには、ある程度、ルールを作らないと、運用がまわらないでしょうし、怒る人も出てきそうですが。。。

Webhook 利用できるアプリ

さて、ここで、そもそも、Webhookが使えるアプリケーションの例をご紹介します。

もちろん、以下以外にもたくさんWebhookに対応したサービスはありますよ!

  • Slack
  • ChatWork
  • Facebook
  • Twitter
  • LINE
  • GitHub
  • トレロ Trello
  • Shopify
  • Dropbox
  • エバーノート Evernote
  • Zoom
  • Zoho
  • stripe

ちなみに、ストライプのWebhookについてのページです。
https://stripe.com/docs/webhooks

大手サービスになりますが、結構あります。

海外のITツールは軒並み導入していますね!

webhookを活用すると、

ワードプレスで作成したお問い合わせフォームからの通知を

SLACKで受け取るなども可能です!

設定方法は、以下のサイトなど、参考になりますよ!

WordPressでメールを送信したらSlackに通知する方法

WordPress プラグイン slack-contact-form-7 で入力内容まで Slack に送るプチハック

Webhooks 種類

Webhooksは、情報の取得と、情報の表示を行う、2つの種類の機能があります。

  1. Incoming Webhook(着信Web フック)
  2. Outgoing WebHooks(発信Webフック)

Incoming Webhook(着信Web フック)は、メッセージを送る仕組み

Outgoing WebHooks(発信Webフック)は、プログラム上で、情報を分析して、取得する仕組み

Webフックを知るために理解しておきましょう!

webフック slack

Webフックを使って、slackに通知を飛ばす仕組みを開発することも可能です!

Slack以外のサービスから、Slackの特定チャンネルへ通知を送信するためには、先程解説したIncoming Webhook URLを使用します

SlackのIncoming Webhook URLは以下のようなURLです。

https://hooks.slack.com/services/bbb/aaa/zzz

bbb/aaa/zzzの箇所はslackのワークスペースのチャンネルによって変わります。

Webフック slack 設定方法

Slackにサインインを最初にしておきましょう!

その上で、slackアプリを作ります。

そして、slackのbotネームを作成

そして、接続するslackのワークスペースやチャンネルを選択

これで、slackのインカミングWebフックURLを取得できるようになります。

Slack App (アプリ) を作成

slackアプリは、Slackの以下URLから作れます。

slackアプリ 公式サイト
https://api.slack.com/apps/new

  • アプリ名を適当に設定
  • ワークスペースを選択
  • あとはクリエイトボタンをクリック!
  • これでslackアプリは作成完了です。

次に、作成したアプリで、Incoming Webhook機能をオンにします。

先程のアプリ作成した後の画面で、

  • 作成アプリを選択
  • Incoming Webhooks クリック
  • Offの表示をクリックしてオンに!

Incoming Webhook機能をオンにすることで、情報の発信が可能になります。

次に、Slack Appの表示名 (Bot Name) を決めていきます。

Bot Nameは、slackにて表示される名前です。App Nameとは違うものです。同じ名前にはしないでくださいね。

bot nameは、App Home クリックして、Editボタンをクリックして下さい。

その後、

Display Name (Bot Name)を入力

これでslackの、botネームが作れますが、投稿するユーザー名も作る必要があります!

ユーザー名は、Default usernameを入力して、その後、Addボタンをクリックして下さい。

次に、Incoming Webhookを特定のチャンネルと接続します。

これは、画面左側のメニューから、Incoming Webhooksをクリックして、Add New Webhook to Workspaceを選択。あとは、接続したいチャンネルを選んで、Allowボタンをクリックするだけ!

これでIncoming Webhook URLを取得できました。

あとは、連携したいアプリ側に、このIncoming Webhook URLを入力すれば、Webフックによるアプリケーション連携が完成です!

まとめ Webhook 便利! アプリ連携を今後はBtoCでも活用!?

いかがでしたでしょうか?

Webhook、便利ですよね。

Webhookとは、アプリ連携の仕組みで、1つのアクションで、その内容を自動的に通知をしてくれる仕組みです。

Webhookがあれば、ユーザーのアクションログなども、SLACKに、ガンガン残せますね。

ビジネスやマーケティングツールと非常に相性がいい、Webhook。

APIとの比較も書きましたが、今後、どんどん、Webhookを活用したサービスが増えていくと思います。

こういった通知を自動化できるツールは、運用ルールがしっかりすると、ビジネスをどんどん高速化してくれます。

また、Iot系との相性もいいですよね。

Iotで、子供が、駅を通過したら、LINEやSLACKなどに通知が来る。

これって、めちゃくちゃ便利ですよね。

ヤマトさんでも使ってほしいですよね。

いま、近所の倉庫から発送でました!みたいな通知ですね。

IFTTT より 無料で利用できる【Integromat】人気 webサービス 連携 を快適に