There are several ways to check if a certain resource has been already cached and served by the Universal CDN edge servers.
In this article, for demonstration purposes, we will check with the Developer Tools Network Monitor in Mozilla Firefox and DevTools network panel in Chrome.
First, let us provide you with brief information about the Response Headers.
The Response Headers are a group of HTTP headers that are used in an HTTP response and that don’t relate to the content of the message. Response headers like Cache-Control, Expires Location, or Server are used to give a more detailed context of the response.
You can read more about the Response Headers at https://developer.mozilla.org/en-US/docs/Glossary/Response_header.
Network Monitor In Mozilla Firefox
Let’s check if a certain resource has been cached and served by the Universal CDN edge servers with the Network Monitor tool in Mozilla Firefox.
The Network Monitor shows you all the network requests Firefox makes, how long each request takes, and details of each request.
To check how to open Network Monitor In Mozilla Firefox click here!
For the purpose of this tutorial, we have created a new CDN zone (11131-1.b.cdn12.com) and specified the location of our resources to be our own origin server (custom location).
For demonstration purposes, we have hit the URL http://11131-1.b.cdn12.com/example.mp4 in the Network Monitor tool in Mozilla Firefox. Then we have clicked on the “Network” tab from the Developer Tools menu, pressed Ctrl + R to reload the content, and clicked on the file (in the example above the file name is example.mp4).
In the example above the “X-Served-From” header is showing that the asset is served by the origin (X-Served-From: origin). It means that this was the first request for this asset after the integration of the CDN services and that the asset has not been cached, yet.
Let’s reload the same file in the Network Monitor tool and to check the Headers again:
Now, the “X-Served-From” header is showing that the asset is served by the Universal CDN edge servers (X-Served-From: l1 / l2 ). It means that this was not the first request for this asset after the integration of the CDN services and that the asset has been already cached.
DevTools Network Panel in Chrome
Let’s check if a certain resource has been cached and served by the Universal CDN edge servers with the DevTools network panel in Chrome.
The Network Panel shows you all the network requests Chrome/Chromium makes, how long each request takes, and details of each request.
Opening the Network Panel
Right-click the element and select Inspect or press Command+Option+C (Mac) or Control+Shift+C (Windows, Linux OS).
For the purpose of this tutorial, we have created a new CDN zone (11131-1.b.cdn12.com) and specified the location of our resources to be our own origin server (custom location).
For demonstration purposes, we have hit the URL http://11131-1.b.cdn12.com/example.mp4. Then we have clicked on the “Network” tab from the DevTools menu, pressed Ctrl + R to reload the content, and clicked on the file (in the example above the file name is example.mp4).
In the example above the “X-Served-From” header is showing that the asset is served by the origin (X-Served-From: origin). This means that this was the first request for this asset after the integration of the CDN services and that the asset has not been cached, yet.
Let’s reload the same file in the DevTools Network Panel in Chrome and to check the Headers again:
Now, the “X-Served-From” header is showing that the asset is served by the Universal CDN edge servers (X-Served-From: l1 / l2 ). It means that this was not the first request for this asset after the integration of the CDN services and that the asset has been already cached.