CORS error when accessing fonts from Dropbox

Question

I am trying to access a .ttf file I have hosted on Dropbox with CSS @font-face rule.

This is the code:

@font-face {
   font-family: calculatorFont;
   src: url(https://www.dropbox.com/s/6yufk6p4mmi8q3u/digital-7.ttf?dl=1);
}

And I get this error.

Redirect from 'https://www.dropbox.com/s/6yufk6p4mmi8q3u/digital-7.ttf?dl=1' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

How can I overcome this?

Possible duplicate of [Ways to circumvent the same-origin policy](http://stackoverflow.com/questions/3076414/ways-to-circumvent-the-same-origin-policy) and slightly off-topic. — josephting, Dec 09 '16 at 01:18
Reverse proxy method can solve this problem but you shouldn't even load font this way. You need to change the headers sent from Dropbox.com to include your domain name in order for it to load properly and unfortunately, you cannot do that. There are many other possible ways to get around this which is the reason why this is off-topic as well. — josephting, Dec 09 '16 at 01:56
https://stackoverflow.com/questions/28919732/cors-support-for-dl-dropboxuserconent-com — loop, May 28 '22 at 07:02

score 0 · Answer 1 · answered Dec 09 '16 at 02:12

0

Just like dropbox, you can try put your static assets on a github repo, then publish it by enable github page for your repo.

answered Dec 09 '16 at 02:12

Hank Phung

1 Answers1