Exercise - Trigger an Azure Function with a GitHub event

Completed

In this exercise, you update your function to parse information from the GitHub webhook payload, and display the results.

Update your function to parse the webhook payload

  1. In the Azure portal, go to the Function App that you created earlier.

  2. On the Function App pane, select your Function App under Functions in the center pane.

  3. Select the HttpTrigger1 you created. The HtttpTrigger1 pane appears for your Function.

  4. Select Code + Test at the top of the screen. The Code + Test pane for your Function appears.

  5. In the path above the code, from the dropdown list, select index.js. The JavaScript for your trigger appears.

  6. Update the code by replacing the last three lines of code in the function body with the following code.

    if (req.body.pages[0].title){
        context.res = {
            body: "Page is " + req.body.pages[0].title + ", Action is " + req.body.pages[0].action + ", Event Type is " + req.headers['x-github-event']
        };
    }
    else {
        context.res = {
            status: 400,
            body: ("Invalid payload for Wiki event")
        };
    }
    

    This code retrieves the event type from the request header, and the title and action fields from the message body. This information indicates that page changed, and whether it's been edited or newly created. The code then constructs a response that summarizes the action. Here's what the JavaScript should look like:

    module.exports = async function (context, req) {
        context.log('JavaScript HTTP trigger function processed a request.');
    
        const name = (req.query.name || (req.body && req.body.name));
        const responseMessage = name
            ? "Hello, " + name + ". This HTTP triggered function executed successfully."
            : "This HTTP triggered function executed successfully. Pass a name in the query string or in the request body for a personalized response.";
    
        if (req.body.pages[0].title){
            context.res = {
                body: "Page is " + req.body.pages[0].title + ", Action is " + req.body.pages[0].action + ", Event Type is " + req.headers['x-github-event']
            };
         }
         else {
            context.res = {
                status: 400,
                body: ("Invalid payload for Wiki event")
            };
        }
    }
    
  7. In the top menu bar, select Save.

Trigger your Azure Function with a Gollum event

  1. Return to your GitHub account.

  2. Select the repository you're using for this module.

  3. In the top menu bar, select Settings. The Settings pane appears.

  4. In the sidebar, select Webhooks. The Webhooks pane appears.

  5. Select Edit for your webhook. The Webhooks/Manage webhook pane appears.

  6. Select the Recent Deliveries tab.

  7. Select the latest (top) delivery entry by selecting its ellipsis button (...).

  8. Select Redeliver.

  9. In the Redeliver payload? dialog box that appears, select Yes, redeliver this payload. This action simulates you changing your Wiki page again.

  10. Select the latest (top) delivery entry (redelivery) by selecting its ellipsis button (...).

  11. Select the Response tab. You should see how the webhook has triggered your function, which then parsed the information, and sent a response similar to the following text:

    Page is Home, Action is edited, Event Type is gollum