Reputation: 14324
I am hosting the blog for my site on tumblr:
blog.withoomph.com
I have modified the theme on the blog and I want to use my own fonts that I use on our main site. I am trying to get the fonts from:
beta.withoomph.com
However, when the page tries to fetch the fonts I am getting a CORS error. This only started hapenning recently, as they use to be fetched with no issues.
Is there a way I can set either IIS or my MVC app to service these fonts to sub domains?
Edit
Sorry, I should know better than that. Here is some more information:
This is the CSS to fetch the urls:
@font-face {
font-family: 'avantgarde';
src: url('http://beta.withoomph.com/content/fonts/avant_garde.eot');
src: url('http://beta.withoomph.com/content/fonts/avant_garde.eot?#iefix') format('embedded-opentype'),
url('http://beta.withoomph.com/content/fonts/avant_garde.woff') format('woff'),
url('http://beta.withoomph.com/content/fonts/avant_garde.ttf') format('truetype'),
url('http://beta.withoomph.com/content/fonts/avant_garde.svg#avantgarde_bk_btdemi') format('svg');
font-weight: normal;
font-style: normal;
}
And this is the error in dev console when it tries to fetch the fonts:
Font from origin 'http://beta.withoomph.com' has been blocked from loading by Cross-Origin Resource Sharing policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://blog.withoomph.com' is therefore not allowed access.
Upvotes: 2
Views: 4814
Reputation: 11554
For security reasons browsers prohibit calls to resources residing outside the current origin so you have to enable Cross-Origin Resource Sharing. add this to web.config
.
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
For more information see this link.
Upvotes: 9