Here’s How I Setup Monitoring on My Site
I recently changed this website from an App Service to a static site hosted in Azure Blob storage. So, the Application Insights (part of Azure Monitor) that I was previously using wasn’t going to work any more.
Rather than try to reconfigure my existing instance, I decided a green field would be more interesting. And maybe even more challenging.
It was actually way simpler than I thought it would be.
I don’t know why I’d been putting it off for so long.
With help from Rod Stewart (circa 1973) and following instructions found here, I wired my site up in less time than it takes to listen to “Every Picture Tells A Story”.
Watch the video above if you haven’t.
(Everything below assumes you are hosting on Azure. If not, grab a free account and follow along)
Create Application Insights Instance
In the same Resource Group as your static site storage, create a new “Application Insights” resource.
Copy Your Instrumentation Key
Once the Application Insights resource is ready and you can view the Overview screen, grab the instrumentation key.
You’ll paste it in the script provided here.
Replace the xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxx with your instrumentation key copied from the overview screen.
Add The Script To All HTML Files
Now that you have a script with your own instrumentation key, we’ll need to place that in each HTML file you wish to monitor.
We in the SRE biz call that toil!
Toil is bad. ;)
Deploy Your Site
In the video, I do this using Visual Studio Code by deploying from a dropdown command in seconds.
Alternatively, I could use Azure Storage Explorer and upload my files FTP style.
NOTE: In the video, I show you an even easier way to do it through the portal when you only have one or two files.
Exercise Your Site
Alright, now that you’ve uploaded all of the HTML with their new monitoring scripts we need to get them to start collecting data. This means going to your site and browsing around.
I suggest using a couple of different browsers and maybe even some of your friends or coworkers, just to get as much activity on your site as possible.
Verify Monitoring Is Collecting Data
Return to the overview screen in the Azure portal. It’s unlikely that you’ll see any data show up on the provided charts.
However, if we use Log Analytics, we can run a Kusto query that will verify if we are getting data.
Go to Log Analytics…
The following query will give us an average duration of Page Views for the last 15 minutes, as reported by the browser.
// average pageView duration by name let timeGrain=1s; let dataset=pageViews // additional filters can be applied here | where timestamp > ago(15m) | where client_Type == "Browser" ; // calculate average pageView duration for all pageViews dataset | summarize avg(duration) by bin(timestamp, timeGrain) | extend pageView='Overall' // render result in a chart | render timechart
It then renders a chart for us to view.
Bask In Your Technical Savviness
You’re all set. I’m planning to come back and check on mine each day for the next week or two just to make sure it’s working as expected.
If you host a static website on Azure, let me know if you are using any monitoring and what you find interesting about the data you are seeing.
-FREE Azure Account
-Static Website Hosting
-Kusto Query Language
-Static Website Hosting
-Monitoring User Flow
-Azure Storage Explorer
-Static website hosting in Azure Storage
-SRE on MS Learn
-Visual Studio Code
-Rod Stewart on Discogs