16

Is there a way to enable CORS for only files of a certain type on IIS7? I am going off this article (https://www.maxcdn.com/one/tutorial/how-to-use-cdn-with-webfonts/) and noticed that the Apache and nginx examples show that CORS is only enabled if the request is looking for a certain Content-Type, whereas the IIS example shows CORS enabled for everything.

I have CSS that is being referenced on an external site but the font files are being blocked by the browser and wish to enable CORS on IIS7 but only for .woff, .woff2, .tff, .eot, and .svg files. I do not wish to enable CORS for everything if possible.

2
  • You can implement and HttpHandler for those specific files and add the CORS header to the response...something like this: tpeczek.blogspot.com/2010/09/…
    – Hackerman
    Sep 22, 2016 at 19:54
  • The problem I have is that I do not have control of the request or response. CSS from my site is being referenced on another site on a different domain using an absolute path to my site. The CSS pulls in fine but the fonts that are referenced in the CSS file that reside on my server are blocked. I do not see of a way that I can capture the response from this. Sep 22, 2016 at 20:03

3 Answers 3

35

Hackerman's answer is great and it led me to a solution, however, there are a few adjustments that I had to make. The first was placing the rule in the outboundRules section under the rewrite node.

<outboundRules>
    <rule name="Enable CORS for Fonts">
        <match serverVariable="RESPONSE_Access_Control_Allow_Origin" pattern=".*" />
        <conditions>
          <add input="{REQUEST_URI}" pattern="^[^\?]+\.(ttf|otf|eot|woff|woff2|svg)(\?.*)?$" />
        </conditions>
        <action type="Rewrite" value="*" />
    </rule>
</outboundRules>

Lastly, the regex was updated to prevent requests such as the one below, which would allow someone to request any URL across origins:

/some/critical/javascript/file.js?v=.woff
/api/secure/users?v=.woff

... but it still allows the following

/some/font.woff
/some/font.woff?etag
/some/font.woff?v=123
1
  • I'm not sure what I am doing wrong. I am getting HTTP Error 500.52 - URL Rewrite Module Error. Config Error: Cannot add duplicate collection entry of type 'rule' with unique key attribute 'name' set to 'Enable CORS for Fonts'
    – MeSo2
    Oct 21, 2022 at 14:33
20

You should add this code to your Web.config:

  <location path="fonts/FontName.ttf">
    <system.webServer>
       <httpProtocol>
          <customHeaders>
             <add name="Access-Control-Allow-Origin" value="*" />
          </customHeaders>
       </httpProtocol>
    </system.webServer>
  </location>
3
  • 3
    Nice, no extra modules required and works like a charm, care to mention that the <location> tag should be the under <configuration> tag May 9, 2018 at 8:26
  • 1
    This is nice and doesnt add the extra overhead of rewriting on the way back out.
    – Gruffputs
    Nov 7, 2018 at 19:53
  • This is good if you want to allow access for any domain. but doesn't work for multiple specific domains
    – CodeHacker
    Apr 17, 2019 at 6:45
2

You can install the IIS rewrite Module https://www.microsoft.com/en-us/download/details.aspx?id=7435 . After installing the module, restart your IIS Manager and click on your website under the “Sites” node. If you see the URL Rewrite Module symbol (shown below) in the window on the right under IIS section, then you are ready to go:

enter image description here

Then on your Web.config, you need to add the following rule:

<rewrite>
 <rules>
  <rule name="Add Cross Origin Access">
    <match serverVariable="RESPONSE_Access_Control_Allow_Origin" pattern=".*" />
    <conditions>
      <add input="{REQUEST_URI}" pattern="^[^\?]+\.(ttf|otf|eot|woff|woff2|svg)(\?.*)?$" />
    </conditions>
    <action type="Rewrite" value="*"/>
  </rule>
 </rules>
</rewrite>
5
  • This is the answer that worked for me. Thank you for your help. The URL Rewrite Module is a really useful tool that I did not know about before. Sep 23, 2016 at 19:26
  • I'm glad to help, Kyle!
    – Hackerman
    Sep 23, 2016 at 19:27
  • 1
    FYI - your regex matches everything past the file extension (ex: a/b/c/font.ttf.zip would be matched). Should it be .*\.(ttf|otf|eot|woff|woff2|svg)$ Jan 14, 2017 at 0:19
  • Hi, saw this solution in a lot of places now, but it doesn't work for me. Seems like some headers are stripped from the response... and even using "customHeaders" it doesn't work, for whatever header I'm adding, any clue? Even in Application_BeginRequest(), I'm lost :(
    – chrilith
    May 17, 2017 at 15:00
  • 1
    Should use Derek's answer below. Need to use <outboundRules> under the <rewrite> node.
    – Adam C.
    Aug 2, 2018 at 20:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.