django2用模板代码图标字体丢失报404 cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff

以前开发网站,不是用php就是用c#或java写后端,跟后端繁重麻烦的代码相比,前端的html+css+JavaScript简直就简单的不算技术,相比之下,工作量也不大。

但如果用django框架,使用python来写后端逻辑,正所谓美女都是需要通过比较而来的,因为python更加的简洁优雅,相比之下,前端松松垮垮的JavaScript,七扭八斜的css,简直麻烦的让人想砸电脑,本来相较于后端工作量较小的前端开发,瞬间成为了整个项目至少百分之八十的工程量!

于是,使用前端模板,就成了一个必由之路!

但,django毕竟还没大行其道,在网上的模板中,基本上所有的模板,都是在为phper开发方便而做的,虽然大同小异,django拿过来用也没什么,但是多多少少也会一些大坑小坑,其中字体的路径配置,就需要讲究一下。

/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff 404
DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff HTTP/1.1" 404
#……

将前端模板代码导入django项目中,运行一看,前端的图标字体丢失了,全都变成了小方块

问题出在哪?

出在一个css文件中,这个文件就是font-awesome.min.css

解决方案:

1.打开font-awesome.min.css

2.删除此文件的第一行(别管有多长)

3.在html文件中,加入:

<style>
@font-face{font-family:'FontAwesome';
src:url("{% static 'font/fontawesome-webfont.eot' %}");
src:url("{% static 'font/fontawesome-webfont.eot' %}") format('embedded-opentype'),
url("{% static 'font/fontawesome-webfont.woff' %}") format('woff'),
url("{% static 'font/fontawesome-webfont.ttf' %}") format('truetype'),
url("{% static 'font/fontawesome-webfont.svg' %}") format('svg');
font-weight:normal;font-style:normal;}[class^="icon-"],[class*=" icon-"]{font-family:FontAwesome;
font-weight:normal;font-style:normal;text-decoration:inherit;
-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing: grayscale;
*margin-right:.3em;}
</style>

4.这时,再运行项目,发现图标字体都出现了。其实这个时候已经不影响使用了,但是仍然还可以看到类似于下面这样的报错,令人看着非常不爽

[23/May/2018 23:06:21] "GET /static/font/cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff HTTP/1.1" 404 0
[23/May/2018 23:06:21] "GET /static/font/DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff HTTP/1.1" 404 0

5.之所以有此报错呢,网上说是因为谷歌被墙,当然了,这不重要,既然不影响使用,目的只是为了不让它出现来恶心人,只要在static/font目录下新建两个空文件,文件名就取

cJZKeOuBrn4kERxqtaUH3T8E0i7KZn-EPnyo3HZu7kw.woff

DXI1ORHCpsQm3Vp6mXoaTXhCUOGz7vYGh680lGh-uXM.woff

就行啦!

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Crossin的编程教室

【Python 第3课】IDE

昨天的课发出去之后,有不少同学发来了反馈,有完成截屏的,也有遇到问题的。一些问题突然让我意识到,很多地方自己描述得不是很到位,会产生歧义,或者干脆就很难听懂。比...

2846
来自专栏恰童鞋骚年

操作系统核心原理-3.进程原理(下):进程通信

进程作为人类的发明,自然也免不了脱离人类的习性,也有通信的需求。如果进程之间不进行任何通信,那么进程所能完成的任务就要大打折扣。人类的通信方式无外乎对白(通过...

1032
来自专栏向治洪

Android逆向工程

在Root前提下,我们可以使用Hooker方式绑定so库,通过逆向方式篡改数值,从而达到所谓破解目的。然而,目前无论是软件加固方式,或是数据处理能力后台化,还是...

29310
来自专栏ionic3+

【技巧】ionic3自动聚焦暴力实现

很早前和群里的人探讨过自动聚焦,在android上可以,但是在ios上失败,后来在网上看到这个:

842
来自专栏视频咖

如何写出一手好的小程序代码,从架构说起

? 作为微信小程序底层 API 维护者之一,经历了风风雨雨、各种各样的吐槽。为了让大家能更好的写一手小程序,特地梳理一篇文章介绍。如果有什么吐槽的地方,欢迎去...

5102
来自专栏哲学驱动设计

产品前端重构(TypeScript、MVC框架设计)

最近两周完成了对公司某一产品的前端重构,本文记录重构的主要思路及相关的设计内容。 公司期望把某一管理类信息系统从项目代码中抽取、重构为一个可复用的产品。该系统的...

2608
来自专栏進无尽的文章

扒虫篇- Bug日志 Ⅷ

不执行的原因是 在VC中使用这个ImageUploaderManager时,需要设置为全局变量,如果是局部变量的话,很快会被销毁掉,其中的代理自然不会执行了。

1913
来自专栏张善友的专栏

在你的网站集成Wiki系统 WikiPlex

Wikiplex 是一种在 .NET Framework 上所开发,具有处理 Wiki 编辑宏功能的小型函式库组件,它提供了数种编辑样式的格式,以让使用者可以类...

2208
来自专栏晨星先生的自留地

老司机带我飚车(2)一个有趣的漏洞PoC调试

3226
来自专栏偏前端工程师的驿站

Thinking in React Implemented by Reagent

前言  本文是学习Thinking in React这一章后的记录,并且用Reagent实现其中的示例。 概要 构造恰当的数据结构 从静态非交互版本开始 追加交...

20610

扫码关注云+社区

领取腾讯云代金券