The built-in Magento rewriting module also rewrites static HTML pages. This is great for performance, but browser security policies require additional headers to be passed over the CDN in order for HTML pages to be loaded over the StackPath CDN.
StackPath EdgeRules allow you to create robust custom rules to modify the behavior of the StackPath CDN. If you have not already, please check this guide to get started.
Creating the Rule
- Select the CDN Site you would like to create the rule for
- Navigate to the EdgeRules tab
- Select Add Delivery Rule
- In the IF section, add
*://Edge.Address/*as the URL Matches Option for this rule. Remember to replace Edge.Address with the actual Edge Address, or custom Delivery Domain. - In the THEN Section, add a response header rule to add
Access-Control-Allow-Headers: x-requested-with.
It is possible to apply this rule to any number of file types by prefixing them with a ? to indicate a wildcard location, and | to separate them. For example, the rule /\.(?.pdf|htm?l|jpe?g|gif)$/ will apply to pdf, html, jpg, jpeg, and gif files.
Verifying the Rule
Since this rule adds a public response header to the CDN Response, it is possible to verify it by checking the headers from your CDN assets using browser inspect tools or cURL requests.
For browser tools, you can right-click anywhere on your website and select inspect or inspect element and navigate to the network tab. If you do not see any requests, you can refresh the page with this tab open to view them as they come in.
Select an asset served from the CDN from this tab to reveal the headers associated with the request. The Access-Control header should appear here.
When performing a cURL test, the option -I is recommended, to show the headers appropriately. Below is an example of a curl, with the Access-Control header highlighted.
If any questions arise or any assistance can be further provided, feel free to drop us a line at hi@stackpath.com, we'll be happy to help you out.