Skip to content

Caching

Tore Nestenius edited this page Oct 24, 2024 · 6 revisions

Caching and CDN Tool

Overview

The Caching and CDN Tool provides various endpoints demonstrating how to control your application's caching behavior. This tool tests caching mechanisms in services like Azure CDN, browser caching, or other caching layers. Using these endpoints, you can observe how different cache control headers influence the caching and retrieval of content.

Purpose

This tool illustrates how to configure caching headers in HTTP responses and how these configurations impact the caching behavior in CDNs and web browsers. It helps developers understand caching policies, optimize application performance, and troubleshoot caching issues in different environments.

Key Features

  • No Cache Control: Sends a response without cache control headers, demonstrating the default behavior.
  • Public Cache Control: Configures a Cache-Control header with a max-age value, allowing the response to be cached for a specified duration.
  • Private Cache Control: Configures Cache-Control and related headers to prevent the response from caching, making it suitable for private or sensitive data.

How It Works

Caching Endpoints

  1. /Caching/GetTimeNoCacheControl

    • Returns the current UTC time without setting any Cache-Control headers.
    • This endpoint demonstrates the default caching behavior when no cache headers are defined.
  2. /Caching/GetTimeWithCacheControl

    • Sets the Cache-Control header to public, max-age=5.
    • The response is cached for 5 seconds. Any requests made within 5 seconds of the initial request will receive the cached response.
  3. /Caching/GetTimePrivateCacheControl

    • Sets the following headers to prevent caching:
      • Cache-Control: no-store, no-cache, max-age=0, must-revalidate, proxy-revalidate, private
      • Pragma: no-cache
      • Expires: 0
    • This endpoint demonstrates how to ensure the browser or any intermediary proxies do not cache a response.

Use Cases

  • Testing CDN Behavior: Verify how different CDN services respect and handle the Cache-Control headers in HTTP responses.
  • Browser Caching: Observe how browsers cache responses and what happens when cache headers are changed.
  • Performance Optimization: Determine which cache control settings are optimal for different data types (e.g., static vs. dynamic content).

Using the Tool with Azure CDN

Creating an Azure CDN Resource

  1. Open the Azure Portal and search for "Front Door and CDN profiles".
  2. Click the "Create Front Door and CDN profile" button.
  3. On the Compare offerings page, select "Explore other offerings", and then choose "Azure CDN Standard from Microsoft (classic)". Click Continue.
  4. On the CDN Details page, enter the following information:
    • Name: MyFirstCDN
    • Region: Global
    • Tier: Microsoft CDN (classic)
    • Uncheck the option to create a new CDN endpoint.
  5. Click the Create button and wait for the resource to be created.

Configuring Azure CDN

Let's configure the CDN to be placed in front of a Cloud Debugger deployment.

  1. Locate the endpoint URL for your Cloud Debugger deployment, such as:
    https://ca-clouddebugger.graygrass-d5f87620.swedencentral.azurecontainerapps.io/ (for an Azure Container Apps deployment).

  2. Go to your Azure CDN resource and add a new CDN endpoint:

    • Name: Provide a unique name for your endpoint.
    • Origin type: Select Custom origin.
    • Origin host name: Enter the URL of your Cloud Debugger deployment (without the http:// or https:// prefix).
    • HTTP port: 80
    • HTTPS port: 443
    • Optimized for: Choose General web delivery.
  3. Click the Add button to create the endpoint.

Using Azure CDN

  1. Once the endpoint is set up, navigate to the CDN endpoint hostname, such as:
    https://myclouddebugger.azureedge.net/. If the Cloud Debugger appears as expected, your CDN is configured correctly. If you encounter an error, wait a few minutes and try again.

  2. Test CDN Caching Behavior:

    • Go to the Cloud Debugger caching tool and click on the "Get time (with no cache control set)" link.
      The Azure CDN will cache this request by default. If you access the same endpoint directly through the Cloud Debugger URL, the displayed time should change with each page reload, while the CDN endpoint will display the same time until the cache expires.

    • Click on "Get time (with cache control, max-age 5 seconds)".
      The CDN will cache the request for 5 seconds, as specified in the Cache-Control header. You should see the time remain constant for 5 seconds before updating.

    • Click on "Get time (private, do not cache)".
      This time, the CDN should not cache the response, and each request to this endpoint will show the current time, as expected.

Summary

Configuring Azure CDN with the Cloud Debugger allows you to test and observe how different cache control headers affect content delivery and caching behavior. This setup is useful for optimizing performance, validating caching rules, and understanding the impact of caching on your application's data.

Additional Resources

Notes

  • Use this tool in a development or testing environment to safely experiment with cache settings.
  • Always verify caching behavior using tools like Fiddler or browser developer tools to ensure the caching policies work as intended.
Clone this wiki locally