Exercise - Create an Azure function triggered by a webhook

100 XP
  • 6 minutes

This module requires a sandbox to complete. A sandbox gives you access to free resources. Your personal subscription will not be charged. The sandbox may only be used to complete training on Microsoft Learn. Use for any other reason is prohibited, and may result in permanent loss of access to the sandbox.

Microsoft provides this lab experience and related content for educational purposes. All presented information is owned by Microsoft and intended solely for learning about the covered products and services in this Microsoft Learn module.

In this first exercise, you'll create your code to parse the GitHub wiki event messages in Azure Functions. You'll configure your function to run when a webhook message is received.

Create a Function App

  1. Sign in to the Azure portal using your MS Learn account.

  2. Select Create a resource. The Create a resource pane appears.

  3. In the left menu pane, under Categories, select Compute, and in the Search services and marketplace search box, search for and select Function App. The Function App pane appears.

  4. Select Create. The Create Function App pane appears.

  5. On the Basics tab, enter the following values for each setting.

    Note

    The Function App Name must be unique. We suggest using something like <your name or initials>triggerapp. Use this name wherever you see <your-functionapp-name> in this exercise.

    Setting Value
    Project Details
    Subscription Concierge Subscription
    Resource Group From the dropdown list, select the sandbox resource group, [sandbox resource group name].
    Instance Details
    Function App Name <your-functionapp-name>
    Publish Code
    Runtime stack Node.js
    Version Accept default
    Region Choose the nearest location to you that is also one of the allowed Sandbox regions.
    Operating system
    Operating System Windows
    Hosting
    Hosting options and plans Consumption (Serverless)

    The free sandbox allows you to create resources in a subset of the Azure global regions. Select a region from the following list when you create resources:

    • West US 2
    • South Central US
    • Central US
    • East US
    • West Europe
    • Southeast Asia
    • Japan East
    • Brazil South
    • Australia Southeast
    • Central India

  6. Select Next : Storage to open the Storage tab. Enter the following values for each setting.

    Setting Value
    Storage
    Storage account (New), and accept the default name.

  7. Select Review + create.

  8. Azure verifies your entries. When verified, select Create.

Create a webhook triggered function

  1. When your deployment is complete, select Go to resource. The Overview pane appears for your Function App.

  2. Under Functions, select Create in Azure portal.

  3. The Create function pane appears.

  4. Under Select a template, select HTTP trigger, and then select Create. The HttpTrigger1 pane appears for your Function, displaying essentials for your new trigger.

  5. In the left menu pane, under Developer, select Code + Test. The Code + Test pane appears for your Function, displaying the JavaScript file that was created from the template. It should look like the following code.

    JavaScript 
    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.";

    context.res = {
        // status: 200, /* Defaults to 200 */
        body: responseMessage
    };
}

    The index.js file is the JavaScript function generated by the portal. The request reads name, either passed in as a query string or as part of the request body, and responds with a "Hello" message.

  6. Above the code is the path with a dropdown list showing the filename. In the dropdown list, select function.json. The JSON file that was created by the template appears. It should look like the following code.

    JSON 
    {
    "bindings": [
        {
            "authLevel": "function",
            "type": "httpTrigger",
            "direction": "in",
            "name": "req",
            "methods": [
                "get",
                "post"
            ]
        },
        {
            "type": "http",
            "direction": "out",
            "name": "res"
        }
    ]
}

    The JSON bindings specify that the function is triggered by HTTP GET and POST requests directed towards the URL of the function app.

Test triggering your function

  1. In the top menu bar, select Get function URL.

  2. In the Get function URL dialog box, in the Key dropdown list, under Function key, select default. In the URL field, select the Copy to clipboard icon. The URL will look something like this:

    text 
    https://<your-functionapp-name>.azurewebsites.net/api/HttpTrigger1?code=aUjXIpqdJ0ZHPQuB0SzFegxGJu0nAXmsQBnmkCpJ6RYxleRaoxJ8cQ==

  3. Paste this URL into a browser, and at the end of URL, append the query string parameter: &name=<yourname>, for example &name=Dick and Jane.

  4. To run the request, press Enter. The response returned by the function appears in the browser. It will look something like this:

    text 
    Hello Dick and Jane. This HTTP triggered function executed successfully.

Congratulations! You now have a function that can be triggered by a URL.

Next unit: Set up a webhook for a GitHub repository

Previous Next