HTTP Headers
Access Control Max Age
The HTTP Access-Control-Max-Age
response header specifies the duration for which the results of a preflight request can be cached. This preflight request contains information within the Access-Control-Allow-Methods
and Access-Control-Allow-Headers
headers, and caching this response can enhance performance by reducing the number of preflight requests needed for subsequent cross-origin requests.
Syntax
Access-Control-Max-Age: <delta-seconds>
Directives
Maximum number of seconds for which the results can be cached as an unsigned non-negative integer.
Firefox caps this at 24 hours (86400 seconds).
Chromium (prior to v76) caps at 10 minutes (600 seconds).
Chromium (starting in v76) caps at 2 hours (7200 seconds).
The default value is 5 seconds.
Example
Cache the results of a preflight request for ten minutes to improve performance and reduce the number of preflight requests sent by browsers. This setting helps browsers remember the permissions granted, avoiding the need to repeat the preflight process frequently.
Header to add:
Access-Control-Max-Age: 600
How to Modify Header using Requestly
Requestly is a powerful Chrome extension that allows you to modify HTTP headers, including the Access-Control-Max-Age header. This is especially useful for testing how browsers handle CORS preflight requests and cache durations during development or debugging. Steps to Modify the Access-Control-Max-Age Header:
- Install and open the Requestly Chrome extension. You can find it on the Chrome Web Store.
- Create a new rule: Click on “Create Rule” and choose “Modify Headers” from the list of available rule types.
- Add a new header modification:
- Under “Action”, select “Add” or “Override”.
- In the “Header Name” field, enter Access-Control-Max-Age.
- In the “Header Value” field, enter the number of seconds you want the browser to cache the preflight response (e.g., 600).
- Set the URL condition: Specify the URL or pattern where this header change should apply (e.g., https://your-api.com/*).
- Save the rule.
Once set up, Requestly will inject the Access-Control-Max-Age header into all matching requests, allowing you to control how long browsers cache CORS preflight responses and optimize request efficiency.
Modifying the Access-Control-Max-Age header can help reduce the number of preflight requests your browser makes, improving performance by letting it cache permission results longer. This is important when you want to test how your app behaves with different caching durations for cross-origin requests.
Table of Contents
- No headings found.