How to include a non-standard font-face in azure?

2019-04-22 16:02发布

问题:

I'm new to the cloud and Azure for that matter and made my first deployment for the company I work for today.

It's located at http://fleetcarma.cloudapp.net currently until I am able to get the domain name to verify with the azure servers.

So something is really weird, when I run my web service locally, or deployed on IIS, the font that I want to use works. But when deployed to Azure, it doesn't and defaults to something like a times new roman of sorts.

I've included the different font types too.

Here is the CSS:

@font-face {
font-family: 'SlateStdBk';
src: url('/Content/ACTExpo/slatestd-bk1-webfont.eot');
src: url('/Content/ACTExpo/slatestd-bk1-webfont.eot?#iefix') format('embedded-opentype'),
     url('/Content/ACTExpo/slatestd-bk1-webfont.woff') format('woff'),
     url('/Content/ACTExpo/slatestd-bk1-webfont.ttf') format('truetype'),
     url('/Content/ACTExpo/slatestd-bk1-webfont.svg#SlateStdBk') format('svg');
font-weight: normal;
font-style: normal;
}

I've included the fonts in the content folder. I've seen this: How can I install custom fonts on Windows Azure?, but that wouldn't work for me because I have to draw all the text, correct?

If anybody could help out, I would be really grateful. Thank you in advance.

回答1:

Thanks @Seva Titov, I had the same problem, after selecting "Content" under the Build Action on the properties, it worked like a charm!



回答2:

For those of you who are pushing something to azure and are NOT familiar with the web config or on a non .net language you can still CREATE a web.config.

Step 1: Best practices, You shouldn't do this on a real live server:

  • Step 1: Enable 'Edit in Visual Studio Online'
  • Portal -> Websites -> Your Website -> Configure tab
  • Set Edit in visual studio Online to On (NOTE THE WARNING)
  • Save

Step 2: Create a new file in the root of your directory titled 'web.config' It should contain the following:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <staticContent>
      <remove fileExtension=".woff" /> <!-- In case IIS already has this mime type -->
      <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    </staticContent>    
  </system.webServer>
</configuration>


回答3:

For your custom font add

<staticContent>
      <mimeMap fileExtension=".woff" mimeType="font/woff" />
</staticContent>

to <system.webServer> section of Web.config