: How to deny direct access to font files used in CSS? I have a website that displays texts with unique, copyrighted fonts. I use a CSS file with "font-face" elements (see the example below)
I have a website that displays texts with unique, copyrighted fonts. I use a CSS file with "font-face" elements (see the example below) and I store the font files in a folder called "type". I would like to deny direct access to these files, so visitors could not copy them. I tried to add an .htaccess file, but it broke the code. (I guess it blocked the links in the CSS.)
@font -face {
font-family: "Your typeface";
src: url("type/filename.eot");
src: local("☺"),
url("type/filename.woff") format("woff"),
url("type/filename.otf") format("opentype"),
url("type/filename.svg#filename") format("svg");
}
More posts by @Samaraweera270
2 Comments
Sorted by latest first Latest Oldest Best
The simple answer is... you can't...
Browsers download font files by default by visiting your site as they need those files to be able to render your custom fonts. The font types eot, woff, opentype and svg does not use any DRM protection, and as far as I know, no other font does for that matter... because of this you can't protect your fonts.
You can however make it harder for them using, or make them more aware that your fonts are copyrighted, several methods include:
HTTP referrer checking
Obfuscation
Data URIs
Visible license data
Segmenting and subsetting
At the end of the day, if someone wants to steal your fonts they will, accept that or don't use them on your website.
Well this is already done as best it can by default.
When you try to access fonts from another domain your browser will block this s a cross origin request (unless you explicitly add a "Access-Control-Allow-Origin" header in your htaccess file). Try it from a development server and you'll see what I mean as you'll get errors in the Console log of the browser. So it's not possible for visitors to reference fonts from your site in their CSS. This is a security feature, rather than a licencing issue but has the nice side effect of preventing people using fonts on your site.
However there is nothing technically stopping another site downloading the fonts from your site, and then uploading to their server and using them from their own domain*. This is because the browser has to be able to have access to the fonts (to display them on your site), and since they have access they can download them.
If you stop them being accessed at all, as you have tried, you'll break your site. Remember CSS is run on the client side, in the browser, not on the server side so the client needs access to the fonts.
So there is nothing you can really do here except check you are not allowing cross origin requests to your font with "Access-Control-Allow-Origin" header.
*This would of course mean that they are breaking copyright, but that is their problem not yours and not a technical issue.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.