Information Security Stack Exchange is a question and answer site for information security professionals. It only takes a minute to sign up.
Sign up to join this community
CSS, JS, images etc are all fetched as no-cors. What's different about web fonts?
Per the spec:
For font loads, user agents must use the potentially CORS-enabled fetch method defined by the [FETCH] specification for URL's defined within @font-face rules. When fetching, user agents must use "Anonymous" mode, set the referrer source to the stylesheet's URL and set the origin to the URL of the containing document.
This mechanism exists mainly as a way for font creators to control which websites can access their possibly copyrighted and licensed products.
As MDN puts it:
... Web Fonts (for cross-domain font usage in @font-face within CSS), so that servers can deploy TrueType fonts that can only be cross-site loaded and used by web sites that are permitted to do so.
As a note this decision was not always welcomed and for a time Chrome didn't require the CORS header for webfonts.
As for why this is different for CSS and JS one reason is the history of the CORS header. CSS and JS predate the introduction of CORS and to apply restrictions to them retroactively would have broken many existing sites. Webfonts on the other hand are relatively new and there was less reason not to apply the same-origin rule.
