Magento 2 CORS & CDN

Question

Using cdn77 which does not have the ability to set cross origin on that end so I need to update the htaccess of the store.

I have updated the pub/static/.htaccess to include fonts setting

Header set Access-Control-Allow-Origin "*"

I intend to limit this to the specific cdn subdomain once I can get the wildcard working properly.

<IfModule mod_headers.c>

    <FilesMatch .*\.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2)$>
        Header append Cache-Control public
    </FilesMatch>

    # set cross origin for fonts
    <FilesMatch .*\.(ttf|otf|eot|woff|woff2)$>
        Header set Access-Control-Allow-Origin "*"
    </FilesMatch>

    <FilesMatch .*\.(zip|gz|gzip|bz2|csv|xml)$>
        Header append Cache-Control no-store
    </FilesMatch>

</IfModule>

I have purged all the files from the CDN multiple times and can confirm that they have in fact been purged but I am still receiving the following:

16:05:34.656 downloadable font: download failed (font-family: "icons-blank-theme" style:normal weight:normal stretch:normal src index:3): bad URI or cross-site access not allowed source: https://xxxxxxx.rsc.cdn77.org/static/version1493759129/frontend/Customdev/themeone/en_US/fonts/Blank-Theme-Icons/Blank-Theme-Icons.ttf 1 styles-m.css:3298:12

This is being returned for all references of ttf, woff and woff2 fonts embedded by default in Magento 2's blank theme even with the wildcard set for the origin. Any advice on where I am going wrong would be greatly appreciated.

Edit: I wanted to confirm that the file is in place. We can access it via the cdn url and it downloads.

Answer 1

So I spent sometime working through this. It appears you can't

Header set

inside of a FilesMatch

I fixed the issue using the following inside of my pub/static/.htaccess

<IfModule mod_headers.c>

    Header set Access-Control-Allow-Origin "https://url-to-my-cdn-instance"

    <FilesMatch .*\.(ico|jpg|jpeg|png|gif|svg|js|css|swf|eot|ttf|otf|woff|woff2)$>
        Header append Cache-Control public
    </FilesMatch>

    <FilesMatch .*\.(zip|gz|gzip|bz2|csv|xml)$>
        Header append Cache-Control no-store
    </FilesMatch>

</IfModule>

Maybe this isn't the most elegant solution but it works and doesn't rely on a wildcard "*" so is limited in scope to the CDN.