チュートリアル: Webhook を作成およびトリガーする

このページの内容

お困りですか?

アトラシアン コミュニティをご利用ください。

コミュニティに質問

Webhook を作成し、トリガーできるかどうかを確認してみましょう。操作をのテスト用に、シンプルな Flask サーバーで Bitbucket の Webhook を受信するリポジトリを作成しました。

開始する前に、次の要件を満たしていることを確認します。

  • Python & Pip
  • ngrok
    (info) ngrok を使用するには、カスタム サブドメインの月間サブスクリプションが必要です。

ステップ 1: Webhook の URL を作成する

Webhook を追加する前に、サーバーの準備を開始します。

  1. 最初に、ローカル システムのサーバーをセットアップするために、次のリポジトリをクローンします。https://bitbucket.org/atlassianlabs/webhook-listener. Webhook Listener リポジトリでクローン URL をコピーします。リポジトリの保存先にするディレクトリで、ターミナルにクローン コマンドと URL を入力します。

    $ git clone git@bitbucket.org:atlassianlabs/webhook-listener.git
  2. Change your directory to the webhook-listener directory.

    $ cd ~/<repos_directory>/webhook-listener
  3. Install the REQUIREMENTS.txt file you just cloned.

    $ pip install -r REQUIREMENTS.txt
  4. Open the .env file from the webhook-listener repository on your local system. The file contains one line: NGROK_SUBDOMAIN=bbwebhook. Set the NGROK_SUBDOMAIN on this line to your preferred subdomain for the server. For the purposes of this tutorial, change it to your first name.

    NGROK_SUBDOMAIN=<first_name>
  5. 次のコマンドで ngrok トンネルおよび Flask サーバーを開始します。

    $ honcho start

    Before you run this command or if honcho start does not work, you may need to make sure that your ngrok directory is in a directory on your PATH.

    Not long after you run the honcho start command, you see the command line return the following:

    You can access this webhook publicly via at http://<first_name>.ngrok.io/webhook
    You can access ngrok's web interface via http://localhost:4040

    これらの両方の URL を記録します。最初の URL は、サーバーへのアクセスに使用する Webhook URL です。最初の URL を送信するリクエストを表示するには、2 番目の URL を使用します。

ステップ 2: Webhook を作成する

  1. 次に、独自のリポジトリの Webhook を作成します。Bitbucket のリポジトリで、左側の [設定] リンク、[Webhook] リンクの順にクリックします。
  2. [Webhook の追加] ボタンをクリックしてリポジトリに Webhook を作成します。
  3. [タイトル] に「Webhook Listber」と入力します。
  4. Enter the URL to the server in the URL field, similar to http://<first_name>.ngrok.io/webhook.
  5. [保存] をクリックします。このチュートリアルでは、[トリガー] を [リポジトリ プッシュ] のままにします。
  6. これで Webhook を作成したので、Webhook の URL を開きます。次のように表示されるはずです。


  7. ngrok の Web インターフェイスの URL を開きます (http://localhost:4040/)。ブラウザがサーバーに対して行った GET リクエストが表示されます。

ステップ 3: Webhook をトリガーする

  1. 次に、リポジトリにオブジェクトをプッシュして、Webhook がトリガーされるかどうかを確認します。最初に、次のテキストで新しいファイルを作成します。

    Let's try out a webhook.
  2. Save the file, as file.txt, to your repository directory on your local system.
  3. Bitbucket リポジトリにファイルを追加し、コミット、プッシュします。

    $ git add file.txt
    $ git commit -m 'Initial commit'
    $ git push
  4. ngrok URL に戻ると、Bitbucket がサーバーに送信したイベント ペイロードの POST リクエストが表示されます。

これで、Webhook を正常に作成およびトリガーしました。

ステップ 4: Webhook リスナーを更新する

  1. From the cloned repository on your local system, open the listener.py file.
  2. Read through this file. Notice that it explains what prints to the command line after you run honcho start and what prints to the webhook URL.
    This file also includes code that uses data from the POST payload to output a notification.

    @app.route('/webhook', methods=['GET', 'POST'])
    def tracking():
       if request.method == 'POST':
          data = request.get_json()
          commit_author = data['actor']['username']
          commit_hash = data['push']['changes'][0]['new']['target']['hash'][:7]
          commit_url = data['push']['changes'][0]['new']['target']['links']['html']['href']
          if _platform == "darwin":
             from pync import Notifier
             Notifier.notify('%s committed %s\nClick to view in Bitbucket' % (commit_author, commit_hash), title='Webhook received!', open=commit_url)
          else:
             print 'Webhook received! %s committed %s' % (commit_author, commit_hash)
          return 'OK'
       else:
          return displayHTML(request)
  3. Modify the tracking() function to update how the Webhook Listener uses the POST data. You can update the payload parameters it uses or what the function does with the data.
  4. Save the listener.py file.
  5. Run honcho start again and push another file to your repository with the webhook.

You should see the changes you made to the listener.py file.

最終更新日 2018 年 5 月 7 日

この内容はお役に立ちましたか?

はい
いいえ
この記事についてのフィードバックを送信する
Powered by Confluence and Scroll Viewport.