To make the websites faster, static content from website is stored in Cloudflare cache on the servers of our globally distributed data centers. Cloudflare stores the copies of data close to your geographical location and loads the websites faster.
Sometimes you make the changes in the backend and websites keep showing content from cache i.e. previous version and updation does not reflect on frontend. Then, it is required to clear the cache of some specific pages as per requirement.
Usually, if we do it on Cloudflare manually, steps to clear/purge cache in Cloudflare are following:
- Log in to your Cloudflare dashboard, and select your account and domain.
- Select Caching > Configuration.
- Under Purge Cache, select Custom Purge. The Custom Purge window appears. Complete the form as per instructions and requirement.
Or if we want to purge everything then,
Under Purge Cache, select Purge Everything. A warning window appears.
- Select Purge.
Problem is that usually, everybody in the team do not have the access to Cloudflare and also, this consumes a lot of time to login into Cloudflare and performing certain steps.
To save the time and make this functionality available to many, we can create a chatbot in teams using webhooks and Connectors. Authors, editors, marketing team and other team members can easily use it from here with or without tech knowledge.
In order to clear Cloudflare cache using chatbot, Outgoing Webhook is the right option. In the rest of the blog, I will give you a walkthrough how can clear Cloudflare cache utilizing outgoing webhook.
Create Outgoing Webhook
- Login into Microsoft teams, create a team.
- Click on three dots on side of team you just created and then select the manage teams option(refer below image)
- In the manage team, click on the outgoing webhook option at the lower right corner(refer below image).
- A window with 3 fields will appear. Add the name of your webhook(Users will use this name to call), Callback URL(here, Azure function app URL), Small description in Description field and profile picture(if you want, optional)
- After adding this information, click on create. Another window with HMAC(Hash-based Message Authentication Code) will appear. Save this because it will be required to ensure the authenticity and integrity of the webhook requests. The HMAC token helps verify that the incoming requests to your webhook endpoint originated genuinely from the expected source.
HMAC is the unique token per configuration and it does not expire.
Set up Visual studio Azure function project
- Visual Studio 2022 version 17.3
- .NET core 6+
- Create Azure function app in visual studio
By selecting Azure functions and clicking Next, you will get many options to select like: Name, Authorization level(Function), Functions worker, Function type (For chatbot, we will use Http trigger),etc. Select as required.
After creating project, you will get following:
Add the code snippet in the .cs file for what the action you want to perform when webhook is call
All input/output related details should be added to host.json file.
Code for Cloudflare cache clear is present here.
To verify that the requests are sent from legitimate client, follow the below steps
- Retrieve the Secret Key: When you set up the outgoing webhook, you should have generated or obtained a secret key. Retrieve this key, as it will be used for HMAC validation.
- Extract the Request Data: Extract the relevant data from the outgoing webhook request, which typically includes the payload and any additional headers or parameters.
- Compute the HMAC: Use the secret key obtained in step 1 and the request data to compute the HMAC using the appropriate hashing algorithm (e.g., HMAC-SHA1, HMAC-SHA256). Check here for hashing algorithm used.
- Compare the HMACs: Compare the computed HMAC with the HMAC received in the request. If they match, the request is considered valid and can be trusted.
Once all this code and configuration is done, create the publishing profile to push the code to azure function.
Publish it to Azure
You require Microsoft credentials to perform this.
- Select the publishing target to push this function app. As we are moving this to azure, select Azure.
- Based on selection, select the required azure service.
- Login with Microsoft credentials.
After you logged in, select the subscription, existing resource group and azure function app
Or you can create new one:
Click on create and start publish action,
Add function URL from azure function to the outgoing webhook Callback URL field.
For logs, check the monitor column.
Finally, test and use your chatbot
Once all this is done, @mention with your outgoing webhook name and any other parameters. To clear Cloudflare cache, pass URL whose cache need to be cleared(refer the below example).
This is for clearing the Cloudflare cache. However, we can create chatbots using Webhooks and connectors for any purpose by creating our custom solutions in Azure functions.
Hope you like it!