kam'up

AzureのWeb Appで運用しているWordPressでWebフォントの文字化けが発生したので原因を調べてみると、CORSが無効になっていているのが原因っぽい。

ちなみにエラーとしてはこのような内容。

Access to font at ‘***’ from origin ‘***’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

ググると.htaccessでの対策は多く出てくるが、私が運用しているのはWindowsなのでweb.configでの対策を備忘録的にまとめる。

<?xml version="1.0" encoding="utf-8"?>
<configuration>
 <system.webServer>
   <httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
     </customHeaders>
   </httpProtocol>
 </system.webServer>
</configuration>

これでCORSが有効となり文字化けが解消された。