Search code examples
httpfontsrequest-cancelling

canceled status blocking font download

I have a page with some text that has been given a font-family of constitution:

enter image description here

This font was downloaded from a foundary and is defined for the page with an @font-face: enter image description here

When the page renders, the browser goes out for the font but the request is blocked by a cancel and the text doesn't get the font-family applied:

enter image description here

Does anyone know what might be causing this cancel? This used to work, and I can't imagine what I did or what happened to break it.

Thanks for any help.

Solution

  • The Access-Control-Allow-Origin header expect only one origin, or a wildcard (*).

    The error you mentioned in the question's comment ("The 'Access-Control-Allow-Origin' header contains multiple values ... but only one is allowed") clearly indicates that there are multiple values in Access-Control-Allow-Origin header, or there are multiple Access-Control-Allow-Origin headers.

    To fix the issue, there should be only one Access-Control-Allow-Origin header, with only one origin value.

    As mentioned in the question: "This used to work". I guess this issue is caused by accidentally add additional Access-Control-Allow-Origin header in the server configuration.

    For reference, please check the W3C specification:

    A resource can have one Access-Control-Allow-Origin header defined. The header must match the following ABNF:

    Access-Control-Allow-Origin = "Access-Control-Allow-Origin" ":" ascii-origin | "*"

    ascii-origin = ASCII serialization of an origin