2017-05-09 24 views
1

我在嘗試加載字體真棒字體時面臨訪問控制源問題。這是在Chrome瀏覽器控制檯中記錄的錯誤消息。Apache訪問控制允許woff2文件類型的起源問題

Access to Font at 'https://example.com/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0' from origin 'https://example2.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://example2.com' is therefore not allowed access. 

而且我更新了apache2服務器httpd.conf並啓用了標頭。

<IfModule mod_mime.c> 
    AddType application/font-woff2   .woff2 
</IfModule> 

    <FilesMatch "\.(ttf|ttc|otf|eot|woff2|woff|font.css|css|js)$"> 
    <IfModule mod_headers.c> 
     Header set Access-Control-Allow-Origin "*" 
    </IfModule> 
    </FilesMatch> 

而且我也嘗試了與.htaccess文件相同的設置,但結果相同。這有點奇怪,因爲我僅面向woff2文件擴展名。

+0

包裝指令中'If​​Module'總是會提出這個問題:「這個模塊真的啓用了嗎?」。如果沒有'IfModule',那麼日誌文件中至少會出現一些服務器錯誤。 –

+0

@OlafDietsche是模塊已啓用。我真的無法修復它在服務器端,但下面的技巧解決了這個問題。 –

回答

0

如何使用服務器腳本,而不是物理字體文件

<style type="text/css"> 
@font-face { 
    font-family: 'OpenSans'; 
    src: url('path/to/fonts.php') format('woff2'); 
} 
html, body{ 
    font: normal 16px OpenSans, sans-serif; 
} 
</style> 

如何解決跨域@字體面的問題與PHP

<?php 
// fonts.php 
header("Access-Control-Allow-Origin: *"); 
header("Content-Type: application/font-woff2"); 
echo @file_get_contents("path/fontawesome-webfont.woff2"); 
?> 

Reference

相關問題