How can I host web fonts from spaces and make them available on localhost during development?

December 21, 2018 673 views
CDN

I am hosting my fonts in spaces - this is the CSS file - https://lumeer-cdn.ams3.digitaloceanspaces.com/latofonts.limited.min.css

During development, the application using this CSS file is hosted on http://localhost:7000. This domain cannot be added in CORS settings (the submit button stays disabled). So I added "*" wildcard. The browser can download the CSS file, but it refuses to download the font files:

Access to font at 'https://lumeer-cdn.ams3.cdn.digitaloceanspaces.com/fonts/Lato-Bold.woff' from origin 'http://localhost:7000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Is there a way to add the headers or any other way to make it work?

1 Answer

Hey friend,

In talking with one of our engineers on this, it was suggested that this article may lead you in the right direction. Although it's meant for another platform, ours is similar in that this advice should translate:

https://help.dreamhost.com/hc/en-us/articles/216201557-How-to-setup-Cross-Origin-Resource-Sharing-CORS-on-DreamObjects

Jarland

  • Hello, the thing (and I believe it is a bug) is that I cannot enter the cirrect values into CoRS settings. I know how it works. I successfully managed to host it on S3. Just because I was able to enter http://localhost:7000/ in their settings. If it was not prevented in DO, I could use your platform.

Have another answer? Share your knowledge.