Azure / wordpress-linux-appservice

MIT License
104 stars 70 forks source link

CORS error in browser when utilizing Azure Blob Storage or Azure CDN via the W3 Total Cache (W3TC) plugin #158

Closed ShawnPOWER closed 1 month ago

ShawnPOWER commented 2 months ago

When utilizing the latest WordPress on App Service marketplace deployment and the Azure Blog Storage (check box during deployment) or the Azure CDN (check box during deployment. In either situation, the fonts do not load properly. This is due to a CORS error (shown below on the storage account) when leveraging the W3 Total Cache (W3TC plugin). The only difference for the Azure CDN would be to change the URL endpoint in the W3TC plugin under CDN advanced settings but the same error exists as shown below.

Obviously, if you add a custom domain you may have to do some additional configuration but the Azure generated DNS records I feel could be added in by default. Is there a change that can be made to the deployment process that adds in the proper CORS settings on the Azure storage account or Azure CDN to successfully utilize the W3TC plugin with how it is deployed today. Or at least some documentation that can be created to show what the proper CORS settings on the storage account that are needed to get this working (as the linked content provided above)?

Access to font at 'https://redactedNameHere.blob.core.windows.net/redactedNameHere/wp-content/themes/redactedThemeNameHere/assets/fonts/redactedFontNameHere.woff' from origin 'https://redactedawesomewordpressdomainhere.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
GET https://redactedNameHere.blob.core.windows.net/redactedNameHere/wp-content/themes/redactedThemeNameHere/assets/fonts/redactedFontNameHere.woff net::ERR_FAILED 200 (OK)
ZubaeyrMSFT commented 1 month ago

Hello @ShawnPOWER, thank you very much for your contribution and bringing this to our notice. I have pushed a fixed that will be available for new deployments in next weeks. Furthermore, I have added a documentation about this: CORS Issue With Azure CDN / FrontDoor or Azure Blob Storage

Thanks again! :)