HarioNote

<h2>ポイント</h2>
<ul>
<li>「Incoming Webhook」というアプリをワークスペースに追加する方法ではありません。
<ul>
<li>この方法は現在非推奨で将来的に削除されることも示唆されている。</li>
</ul>
</li>
<li>本記事での方法は<code>slack api</code>のページの<code>Your Apps</code>の<code>Create New App</code>でAppを作成し、そのAppの設定項目の｀Incoming Webhooks`を使用する方法です。（現在はこちらが推奨されている）</li>
</ul>
<h2>本編</h2>
「Webhookでメッセージをチャンネルにポストするやつ」を作る場合、<a href="https://slack.com/intl/ja-jp/apps">slack app directory</a>で「Incoming Webhook」というアプリ（「Incoming Webhook」で検索すれば出てくる）を使うのが、それまでスタンダードだったようですが、「Incoming Webhook」アプリのページを見ると、「これはレガシーな方法だから<code>Slack apps</code>を使ってね」と書かれております。
<img src="https://storage.googleapis.com/newt-files/4f54c3a9-8df9-4f55-a77a-3786aaca6f41/2024-02-11_1.webp" alt="2024-02-11_1.webp"> 
<img src="https://storage.googleapis.com/newt-files/eceefe27-2e52-480b-a7e0-8d8685999637/2024-02-11_2.webp" alt="2024-02-11_2.webp"> 
<img src="https://storage.googleapis.com/newt-files/b4a30316-c6c7-43bd-a515-7418215cd241/2024-02-11_3.webp" alt="2024-02-11_3.webp">
この<code>Slack apps</code>の表記はリンクになっているのでクリックしてみると「slack api」のページに遷移します。 
<img src="https://storage.googleapis.com/newt-files/c848067f-0976-48da-aff2-ea66876c7285/2024-02-11_4.webp" alt="2024-02-11_4.webp">
<h3>Webhookでメッセージを送信できるAppを作る</h3>
というわけで、<code>Your apps</code>をクリックしてその先で<code>Create New App</code>ボタンをクリックしてWebhookでメッセージを送信できるAppを作ってみます。 
<img src="https://storage.googleapis.com/newt-files/325d9c8f-55a4-4eca-989c-362ffa606a33/2024-02-11_5.webp" alt="2024-02-11_5.webp">
モーダルが表示されるので<code>Form scratch</code>を選択して次へ 
<img src="https://storage.googleapis.com/newt-files/64fc8012-9b05-4814-8a11-0a72209666d1/2024-02-11_6.webp" alt="2024-02-11_6.webp">
次にApp Nameを入力します。そして使用するワークスペースを選択します。 
<img src="https://storage.googleapis.com/newt-files/5999c9be-1f00-43bc-827e-70bb7d62ef23/2024-02-11_7.webp" alt="2024-02-11_7.webp">
Appが作成され、Appの設定ページが表示されます。 
<img src="https://storage.googleapis.com/newt-files/105bbfdb-f0fe-4bcb-bd2e-ac3d37edf318/2024-02-11_8.webp" alt="2024-02-11_8.webp">
左ナビメニューにある<code>Incoming Webhooks</code>をクリックします。 
そして、ラジオボタンをオンにします。 
<img src="https://storage.googleapis.com/newt-files/2a0ec275-7937-4e0b-8518-5306b8a41716/2024-02-11_9.webp" alt="2024-02-11_9.webp">
オンにするとWebhookのためのURLを管理する欄が表示されるので、<code>Add New Webhook to Workspace</code>をクリックします。 
<img src="https://storage.googleapis.com/newt-files/11b1e2c0-2b00-469b-8b9f-9b1ce2d4633c/2024-02-11_10.webp" alt="2024-02-11_10.webp">
Webhookでメッセージをポストしたいチャンネルを選択します。 
<img src="https://storage.googleapis.com/newt-files/5a3b7ca9-2c8c-4c43-9d60-5612961e8270/2024-02-11_11.webp" alt="2024-02-11_11.webp">
Webhook URLが生成されます。これでWebhookでメッセージを送れるようになりました。 
<img src="https://storage.googleapis.com/newt-files/00b4d6a7-9207-4464-ae7a-461aacd8b7db/2024-02-11_12.webp" alt="2024-02-11_12.webp">
<h3>Webhookでメッセージをポストしてみる</h3>
サンプルのcurlコマンドのURL部分だけ生成したものに置き換えて実行してみます。
<pre><code>curl -X POST -H 'Content-type: application/json' --data '{&quot;text&quot;:&quot;Hello, World!&quot;}' https://hooks.slack.com/services/XXXXX/XXXXX/XXXXX
</code></pre>
<code>invalid_payload</code>と言われた…
<code>--data</code>の部分が良くなかったらしい。 
<code>--data '{\&quot;text\&quot;:\&quot;Hello, World!\&quot;}'</code>のように<code>&quot;</code>をエスケープしたら送信できた。 
以下が成功した書き方。
<pre><code>curl -X POST -H 'Content-type: application/json' --data '{\&quot;text\&quot;:\&quot;Hello, World!\&quot;}' https://hooks.slack.com/services/XXXXX/XXXXX/XXXXX
</code></pre>
<img src="https://storage.googleapis.com/newt-files/214f7cca-55a9-4750-b3e3-9102f952bf7e/2024-02-11_13.webp" alt="2024-02-11_13.webp">
できた！
以上！

#Slack

slack apiの「Create New App」から、「Webhookでslackにメッセージを送る」Slack appを作るやり方の備忘録【非推奨じゃないやつ / Incoming Webhook】