A Webhook for GitHub configure

Webhooks when Serverless Development use, part 2 A Webhook for GitHub configure

Webhooks provide a simple way, such as Apps on an http endpoint from other services on events notified can be. In this part of our Workshops, we use the Webhook feature of GitHub to Update a Wiki page.

Company to the topic

A finished custom Webhook on GitHub, the inform is a Wiki about Changes to the Repository.A finished custom Webhook on GitHub, the inform is a Wiki about Changes to the Repository.

(Image: Three Of A Kind / GitHub)

On GitHub Webhooks for an organization or a selected directory can be set up. It will trigger the Webhook whenever at least one or more of the subscribed events occur.

For our purposes, the interesting, the event “Gollum is here”. Thus, the outsourcing developer can create a Webhook that listens for example, on Updates for its GitHub Wiki in relation to the creation and Update of a Wiki page. To do this, you navigate to the GitHub to the Settings page of the repository in the GitHub Portal and click on “Webhooks” …

Webhooks are a GitHub built-in function.Webhooks are a GitHub built-in function.

(Image: Three Of A Kind / GitHub)

… and there click on the button “Add webhook”. The corresponding page now to make some settings. To do this, one must be always aware of what is an Event and what types of events, for example, GitHub supports, because Events are the focal point at the Webhooks. They occur, for example, if the Repository, actions are performed.

In this case, the Webhook is triggered, it calls the “Payload URL” is specified URL, and sends the payload, and other event information at this URL. All of GitHub supported Webhook events, and information about when this can be performed, to be found on the GitHub page “Webhook events and payloads”.

The configuration page for a GitHub Webhook.The configuration page for a GitHub Webhook.

(Image: Three Of A Kind / GitHub)

So we come back to the setting options on the GitHub”Add webhook”page. The relevant definitions are the Following: In the “Payload URL” is the URL of the server that the Webhook POST receives requests.

Each event type has a specific payload Format. This payload contains the information about the event that triggered the Webhook. We have determined the URL of the http Trigger Azure Function in part 1 of our Workshops. It looks like this:

https://devinsiderfa.azurewebsites.net/api/httpTrigger1?code=pRdaxdg7T4UK2KMa87rq9aytXK6/e0X9eE94EyLXMdSFNTkXWR23Gg==

We want to inform our external Azure-Function Changes on the Wiki page.We want to inform our external Azure-Function Changes on the Wiki page.

(Image: Three Of A Kind / GitHub)

In the “Content type” is that Webhooks are sent on the basis of two different types of content: the content type “application/json” will be forwarded to the JSON payload directly as the body of the POST request. With the content type “application/x-www-form-urlencoded” is sent to the JSON payload as a form Parameter with the name of “payload”.

The configured Webhook on GitHub.The configured Webhook on GitHub.

(Image: Three Of A Kind / GitHub)

In the case of “Which events would you like to trigger this webhook?”, we choose the Option “Let me select individual events.” and put a check mark in the “Wiki” to listen on Updates in the Wiki of our Repository. This is precisely the above-mentioned Gollum Event. Then we click on the “Add webhook”. The result should look as shown in the preceding figure.

Webhook test

A first Test of our Webhooks.A first Test of our Webhooks.

(Image: Three Of A Kind / GitHub)

To Test our Webhooks, we click in the GitHub Portal for our Repository on the tab “Wiki”, select the previously created by us page and click on “edit”. There we enter, for example, “Webhook Test”.

The Request-play load of our Webhooks.The Request-play load of our Webhooks.

(Image: Three Of A Kind / GitHub)

Then we navigate to “settings / Webhooks”, where we find a corresponding Push-entry. There we click on “Edit” and scroll to the section “Recent Deliveries”. Here only one ID of the Form “a18aa670-49c7-11eb-836f-4c9fe122677e” is first of all to see. If you click on the three dots to the right, we also see the “Header” and “Payload” in the tab “Request” ….

The Response Body of the response to the Webhook.The Response Body of the response to the Webhook.

(Image: Three Of A Kind / GitHub)

… as well as “Header” and “Body” in the tab “Response”, respectively, with the successful http Status Code of 200. In addition, we are of the Payload, for example, the Detail can be found in Information that the Wiki page was edited. The payload consists of the sections “pages”, “repository”, and “station”.

Conclusion

In this part of the workshop, we have seen how we can Gollum events in our GitHub Repository, specifically on Changes to the Wiki page to listen, by setting up a matching Webhook on GitHub. In part 1, we have also shown how a serverless Azure Function can be triggered by an external http Trigger.

In the third part, we consider the payload from the event of “Gollum” in more detail, and then our Azure adjust the function so that it parses the Payload of the Webhook Event, for our purposes, and suitable responds to them.

(ID:47109095)

Ready to see us in action:

More To Explore

IWanta.tech
Logo
Enable registration in settings - general
Have any project in mind?

Contact us:

small_c_popup.png