关于nginx环境下bootstrap中font-awesome图标不显示的问题
潜水很久,第一次在segmentfault提问题,
最近开始研究bootstrap,也发现了font-awesome这个好东西,
昨天在从网上down了一份基于bootstrap的前端模板,
发现font-awesome图标均无法正常显示,排除了浏览器的问题,
因为逐个的在safari、chrome、firefox、IE11下面都测试过了
症状为:
IE11 =》完全不显示
safari、Chorome =》 应该显示图标的地方显示了一个个的小方框
在搜索引擎搜索过一些答案,发现别人同样问题只出现在firefox上面,
原因是:nginx的跨域访问问题
解决方法是在nginx中增加一个响应头:
location ~* \.(eot|otf|ttf|woff)$ {
add_header Access-Control-Allow-Origin *;
}
我也按照这种方案做了,可还是无法显示
浏览器调试模式下,有个错误信息如下:
[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (fontawesome-webfont.woff, line 0)
用浏览器去访问这个文件也是访问不到的,提示error404!
http://localhost/admin-pages/fickle/assets/css/font-awesome/fonts/fontawesome-webfont.svg?v=4.1.0
症状图片如下:感谢。
12月17日补充:
问题解决了,不是nginx的问题,我犯了一个低级错误,这套html模板是我用wget下载的,在下载时候wget根据链接请求自动在字体文件扩展名后面加了参数,本来一个ttf字体变成了xxx.ttf?v=4.0.1 难怪请求字体文件提示404.修正一下文件扩展名都可以显示出来了。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(5)
肯定不是因为后面加版本的原因。。
请求404的是svg文件吗?nginx的配置里没有svg,加上svg试一下?
楼上的办法很好,解决了楼上的办法很好,解决了.
错误提示已经很清楚,404表示客户端错误资源找不到,建议你去看看http的所有错误代码表示的意思。
跟url后面加参数是没有影响的只是为了刷新,而且加的参数你没有用到也不会出现404错误,肯定是路径问题,或者编译后的资源没有在目标地出现,重新编译,或者是不是编译配置的问题
不知道你是不是第一个写的解决办法,网上各种转发这个的.....