フォントカスタムスクリプトから動的にロードされたときにすばらしいアイコンが表示されない

Question

頻繁にリクエストするさまざまなファイルを含むカスタムスクリプトを作成しました。このようなファイルの例は以下のとおりです。

• bootstrap.css
• bootstrap.js
• jquery.js
• jqueryui.js
• フォントawesome.css

マイカスタムスクリプト名前はremote.phpです。私はこのように私のページに私のランダムなCSSとJSファイルを含めています：

<!-- bootstrap css --> 
<link rel="stylesheet" href="remote.php?type=bscss" type="text/css"> 
<!-- font awesome css --> 
<link rel="stylesheet" href="remote.php?type=facss" type="text/css"> 
<!-- bootstrap js --> 
<link href="remote.php?type=bsjs" type="application/javascript"> 
<!-- jquery js --> 
<link href="remote.php?type=jqueryjs" type="application/javascript"> 

を今、私が設定/私のサーバーにアップロードし、それぞれのウェブサイトからダウンロードされ、インストールされている含めていたすべてのファイル（必要な場合）自宅のサイトで提供される指示に従ってください。

私のスクリプトは期待通りに動作します.1つのキャッチで.....素晴らしいフォントのアイコンは、アイコンの代わりにブロックを表示します。他のすべてはうまくいきます....

私はremote.phpファイルに、私が呼び出しているスクリプトに基づいてヘッダーを設定するようにしました。

• の.cssヘッダは、テキスト/ cssのように設定し
• の.jsヘッダーを設定アプリケーション/ javascriptの

フォント素晴らしいcssファイルのsrc属性には、私のウェブサイトの完全なURLに更新されましたが、まだ何もない。

font-awesome.cssファイル（私のサーバー上にあります）を直接呼び出すと、アイコンが機能します。アイコンを動作させるためには、アイコンを使用する必要があります。しかし、私の必要なファイルをすべて1つのスクリプトに入れておくと、人生がよりシンプルになります。

Answer 1

フォントもダウンロードする必要があります。おそらく、あなたはフォントへの相対的なパスを持っているでしょう。

Answer 2

私は、私の問題を解決することができましたCORSの問題であることが判明しているし、代わりに404を返すので、それは403

を返していましたソリューションがにある私の.htaccessファイルを、編集しました私のサーバーのルート。次のコードは私の問題を解決しました。

# ---------------------------------------------------------------------- 
# Webfont access 
# ---------------------------------------------------------------------- 
# Allow access from all domains for webfonts. 
# Alternatively you could only whitelist your 
# subdomains like "subdomain.example.com". 
<IfModule mod_headers.c> 
    <FilesMatch "\.(ttf|ttc|otf|eot|woff?|woff2?|font.css|css)$"> 
     Header set Access-Control-Allow-Origin "http://SUBDOMAIN.DOMAIN.org" 
    </FilesMatch> 
</IfModule>