練習 - 設定 GitHub 存放庫的 Webhook

已完成

在此練習中,您將設定 GitHub 存放庫的 Webhook。 您會了解如何接聽特定事件 (在此案例中是 Gollum 事件),以及如何在觸發事件時,對您的函式進行 Webhook 回撥。

設定

  1. 使用網頁瀏覽器,登入您的 GitHub 帳戶 \(英文\)。

  2. 在左側功能表窗格中,選取 [新增] 以建立新的存放庫。 [建立新的存放庫] 頁面隨即出現。

  3. 在 [存放庫名稱] 方塊中,輸入有意義的名稱,例如 LearnWebhookTest

  4. 選取 [公用] 以啟動您的 Wiki 模組,並在功能表中找出來。

  5. 選取 [建立存放庫]。 [快速設定] 頁面隨即出現。

  6. 選取 [建立新檔案] 連結。

  7. 在頂端功能表列,選取 [Wiki] 以顯示存放庫 (或 repo) 中的頁面。 [歡迎] 頁面隨即出現。

  8. 選取 [Create the first page] \(建立第一個頁面\)。 [建立新頁面] 範本隨即出現。

  9. 新增一些文字,然後選取 [儲存頁面]。 Wiki 中的第一頁是首頁。

新增 Gollum 事件的 Webhook

Gollum 是存放庫 Wiki 中每次建立或更新頁面時所觸發 GitHub 事件的名稱。

  1. 在 Wiki 檢視的首頁上,[頁面] 側邊欄列出存放庫中的頁面。 選取 [Home] \(首頁\) 以顯示首頁。

  2. 在首頁的頂端功能表列中,選取 [Settings] (設定)。 [設定] 窗格隨即出現。

  3. 在 [Settings] (設定) 側邊欄中,選取 [Webhooks]。 [Webhooks] 窗格隨即出現。

  4. 選取右上角的 [Add webhook] (新增 Webhook)。 GitHub 可能會要求您確認 GitHub 的密碼。

  5. 在 [Webhooks/ Add webhook] (Webhooks/ 新增 Webhook) 窗格中,針對每個設定輸入以下的值。

    設定
    承載 URL 您在前一個練習中的 Azure 函數應用程式的 URL。 如需說明,請參閱下方附註。
    內容類型 從下拉式清單中,選取 [application/json]
    要由哪些事件觸發此 Webhook? 選取 [Let me select individual events] (讓我選取個別事件)。在出現的事件清單中,向下捲動並選取 [Wiki] 核取方塊。 請確定沒有選取其他核取方塊。
    使用中 已核取。

    提示

    從命令列選取 [取得函式 URL],以從 [Azure HttpTrigger] 窗格複製函式 URL。 您的 URL 看起來類似:https://<your-functionapp-name>.azurewebsites.net/api/HttpTrigger1?code=aUjXIpqdJ0ZHPQuB0SzFegxGJu0nAXmsQBnmkCpJ6RYxleRaoxJ8cQ==

  6. 選取 [新增 Webhook]。 [Webhooks] 窗格隨即出現。

  7. 確認新的 Webhook 出現。 名稱的結尾應該是 (gollum)

測試 Webhook

  1. 在 GitHub 的頂端功能表列中,選取 [Wiki]。 您稍早建立的首頁頁面隨即出現。

  2. 選取 [編輯]。 [編輯首頁] 窗格隨即出現。

  3. 在窗格的文字區域中,輸入下列文字:

    Testing Webhook
    
  4. 選取 [Save Page] \(儲存頁面\)。 [首頁] 頁面再次出現。

  5. 在頂端功能列中,選取 [Settings] (設定)。 [設定] 窗格隨即出現。

  6. 在側邊欄中,選取 [Webhooks]。 [Webhooks] 窗格隨即出現。

  7. 選取 [編輯]。 [Webhooks/Manage webhook] (Webhook/管理 Webhook) 窗格隨即出現。

  8. 選取 [最近的傳遞項目] 索引標籤 (您可能需要捲動至頁面底部)。

  9. 在清單中,選取省略符號 (...),以選取前幾個 (最新的) 傳遞項目。

    您將會看到 [標頭] 區段,包括 [事件]

    Request URL: https://testwh123456.azurewebsites.net/api/HttpTrigger1?code=aUjXIpqdJ0ZHPQuB0SzFegxGJu0nAXmsQBnmkCpJ6RYxleRaoxJ8cQ%3D%3D
    Request method: POST
    Accept: */*
    content-type: application/json
    User-Agent: GitHub-Hookshot/16496cb
    X-GitHub-Delivery: 9ed46280-6ab3-11e9-8a19-f1a14922a239
    X-GitHub-Event: gollum
    X-GitHub-Hook-ID: 312141005
    X-GitHub-Hook-Installation-Target-ID: 394459163
    X-GitHub-Hook-Installation-Target-Type: repository
    

    您也會看到 [承載] 區段包含的資訊指出已編輯 Wiki 頁面。 承載包含 pagesrepositorysender 區段,看起來應該像以下範例:

        "pages": [
            {
                "page_name": "Home",
                "title": "Home",
                "summary": null,
                "action": "edited",
                "sha": "04d012c5f92a95ae3f7721173bf9f2b1b35ea22f",
                "html_url": "https://github.com/.../wiki/Home"
            }
        ],
        "repository" : {
            "id": 176302421,
            "node_id": "MDEwOlJlcG9zaXRvcnkxNzYzMDI0MjE=",
            "name": "tieredstorage",
            ...
        },
        "sender" : {
            ...
        }
    
  10. 在 [最近的傳遞項目] 索引標籤下,選取 [回應] 索引標籤。

    您會看到 Azure 函式產生的回應訊息。 對於此範例,本文應該包含訊息。 已成功執行此 HTTP 觸發函式。 在查詢字串或要求本文中傳遞名稱以取得個人化的回應.