Teams의 Incoming Webhook 사용(cURL, Node-RED와 결합)

11131 단어 incoming-webhookWebhook팀node-red
Teams에서 Webhook을 시도하려고 할 때 다음과 같은 방법으로 할 수 없었기 때문에 메모를 기울여 기사를 썼습니다.

● 수신 Webhook을 사용하여 외부 요청을 Microsoft Teams에 게시 - Teams | Microsoft Docs
htps : // / cs. 미 c 로소 ft. 코 m / 그럼 - jp / 미 c 로소 f는 아ぇ b 호오 k

채널 메뉴를 살펴보기



서두에 쓴 문서의 기재대로라면 이하의 메뉴에 커넥터라고 하는 항목이 나올 것입니다만, 뭔가 계정의 관계등이 있는지 표시가 되지 않았습니다.



앱에서 Incoming Webhook 추가



그래서 앱을 추가할 때 Incoming Webhook을 검색해 보았습니다.



따라서 Incoming Webhook이 위 이미지와 같이 표시되었으므로 선택한 후 화면이 다음과 같습니다. 이 화면에서 '팀에 추가'를 누릅니다.


그런 다음 아래 화면에서 채널을 지정할 수있었습니다. 이번에는 Webhook을 테스트하기 위한 채널을 만들었으므로 아래 화면에서 해당 채널을 지정했습니다.


채널이 지정된 상태에서 화면 오른쪽 하단에 있는 "커넥터 설정"을 선택합니다.


그 후의 화면에서는, 이름의 지정과 화상 변경을 실시할 수 있는 것 같습니다만, 이번은 이름만을 지정했습니다.


화면 아래쪽으로 가면 Webhook용 URL이 표시되므로 이를 메모해 둡니다. 그런 다음 "완료"라고 표시된 버튼을 누릅니다.


Webhook에서 메시지 보내기



설정은 할 수 있었기 때문에 메시지를 보내는 방법을 살펴 보겠습니다.

송신자에서 cURL 사용



이하의 문서의 「 cURL을 사용하여 메시지를 Webhook에 게시 」라고 하는 부분에 cURL 를 사용하는 경우의 커멘드가 쓰여져 있었습니다.

● 커넥터 및 Webhook에 메시지 보내기 - Teams | Microsoft Docs
htps : // / cs. 미 c 로소 ft. 코 m / 쟈 jp / 미 c 로소 f는 아 ms / p t t rm / ぇ b 호오 ks - an d 콘 c와 rs / 호 w 및 / 콘 c와 rs 응 g # 포 st - 어서 와서 - 글쎄, 어서,

구체적으로는 다음과 같습니다.
// on Windows
curl.exe -H "Content-Type:application/json" -d "{'text':'Hello World'}" <YOUR WEBHOOK URL>

// on macOS or Linux
curl -H 'Content-Type: application/json' -d '{"text": "Hello World"}' <YOUR WEBHOOK URL>

위 명령의 '<YOUR WEBHOOK URL>' 부분은 이전에 기록한 Webhook용 URL로 대체됩니다. 그리고 명령을 실행한 후 Teams 앱 채널을 살펴보면 다음 내용이 게시되었는지 확인할 수 있었습니다.



송신 측에서 Node-RED 사용



이번에는 Node-RED를 송신측에서 이용해 보겠습니다.

작성한 플로우는 다음과 같습니다.


또한 각 흐름의 설정은 다음과 같이 합니다.

Inject 노드



여기에서는 msg.payload 에 Webhook 로 보내는 JSON 을 지정하고 있습니다.


HTTP 요청 노드



여기에서는, 메소드·URL·출력 형식의 지정을 실시하고 있습니다.


위의 설정이 완료되면 배포를 잊지 마십시오.

그런 다음 위의 흐름을 실행하여 다음과 같이 Teams에 메시지를 보낼 수있었습니다.


요약



위와 같이 Teams에서 외부에서 메시지를 보낼 수 있었습니다.

앞으로 간단한 텍스트 전송 이외에 할 수 있는 것들을 시도해 보겠습니다.

【추기】 UIFlow와의 조합



M5Stack 시리즈의 비주얼 프로그래밍 환경인 UIFlow와 조합도 시험해 기사로 해 보았습니다.

● Teams의 Incoming Webhook과 UIFlow의 결합 - Qiita
h tps:// 퀵했다. 소 m/용도 y/있어 MS/9아 71화 0b71 그림 825C45106

【여담】 Fetch API를 시도한 이야기



과거에 다음 기사에서도 사용한 Fetch API도 시도해 보았습니다. 결과는 CORS와 관련된 오류로 인해 실패했습니다 (Discord이면 괜찮 았지만).

● Discord 서버의 텍스트 채널에 대한 메시징은 UIFlow 및 Fetch API를 사용하여 수행됩니다.
htps : // 이 m / y y / ms / c77106 A23b60b364b9 A0

덧붙여서, 작성한 소스 코드는 다음과 같습니다.
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8" />
    <title>Teams の Incoming Webhook を試す</title>
  </head>
  <body>
    <button onclick="send()">メッセージを送る</button>
    <script>
      const url = "【上記で設定した Teams の Webhook用URL】";
      const message = { text: "ブラウザからメッセージ送信" };

      function send() {
        postData(url, message)
          .then((data) => console.log(data))
          .catch((error) => console.error(error));

        function postData(url = ``, data = {}) {
          return fetch(url, {
            method: "POST",
            mode: "cors",
            headers: {
              "Content-type": "application/json",
            },
            body: JSON.stringify(data),
          }).then((response) => response.text());
        }
      }
    </script>
  </body>
</html>
redmine과 Teams를 Microsoft PowerAutomate로 연결
Teams의 Incoming Webhook과 UIFlow의 결합

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage