2017-12-02 154 views
1

我有一個我以前見過的問題。我實施瞭解決方案,但問題依然存在。404對於Azure上的自定義ttf字體(.NET MVC 5)

我下載了兩個自定義的ttf字體用於我的項目,蒙特雷和麪包店。

這兩種字體都已安裝。這兩條戰線都在我的內容文件夾中。我更新了兩者的字體屬性,以便內容在構建時複製「if newer」。我在我的web配置文件中添加了必要的語言。我在我的CSS中創建了字體規則。

在我的本地機器上,即使訪問我的應用程序的AzureSites版本,也會出現自定義字體。在其他任何一臺電腦上,它們都沒有出現,並在控制檯中顯示404。

請看下圖。先謝謝您的幫助!

This first image is how the site SHOULD look with the fonts working properly

Font files in my Solution Explorer

Relevant code in my web.config

Font properties, confirming that I am copying to the server directory

404 error messages in the console

編輯以添加CSS文件的圖像。

Here is the solution explorer in full. The relevant font CSS is in Site.css

Here are the font face rules in Site.css for the custom fonts.

Here is an example of the implementation of the new font-face, within Site.css

+0

我相信你捆綁CSS的方式有問題。你可以在你的問題中分享相關代碼嗎? –

+0

@GauravMantri我更新了問題以包含CSS代碼的圖片。感謝你目前的幫助! – BoGoodSki

回答

0

我懷疑的是,問題是..\fonts/baker.ttf..

比方說,你的目錄結構

content/ 
    styles/ 
    stylesheet.css 
    fonts/ 
    baker.ttf 

所以當你的HTML中包含

<link rel="stylesheet" href="/content/styles/stylesheet.css"/> 

解析網址爲/content/styles/../fonts/baker.ttf,一切的偉大工程。

但是,如果使用mvc進行部署,您的樣式表可能會與bundler捆綁在一起並編譯。該鏈接可能類似​​於

<link href="/bundles/css?v=Mny4y0TdpT_Ey6yWlayc6zrqhuQE-XSEh-dK8IJOsqc1" rel="stylesheet"> 

因此,那麼解決的網址是/bundles/../fonts/baker.ttf,這是不存在的。如果是這樣的話,我無法從屏幕截圖中看到,但這是我的猜測。

嘗試使用絕對網址,例如/content/fonts/baker.ttf作爲字體導入而非相對導入。

此外,該反斜槓是高度懷疑。使用正斜槓,反斜槓不是URL中的有效分隔符。