server {
listen 8082; #
server_name 192.168.16.88; #
root /home/ywt/workspace/kuF/web/statics; #
autoindex on; #
autoindex_exact_size off; #
autoindex_localtime on; #
}

原配置如上,实际图标加载出来乱七八糟;

经过具体分析,实际css文件正常加载,字体找到,可能 url(../) 访问异常,即获取上级文件夹字体异常。

@font-face{
...
src:url('../fonts/fontawesome-webfont.eot?v=4.0.3');
src:url('../fonts/fontawesome-webfont.eot?#iefix&v=4.0.3')
...
}

原因是:nginx的跨域访问问题
解决方法是在nginx中增加一个响应头:

location ~* \.(eot|otf|ttf|woff)$ {
add_header Access-Control-Allow-Origin *;
}

问题得解。完整配置如下:

    server {
listen 8082; #
server_name 192.168.16.88; #
root /home/ywt/workspace/kuF/web/statics; #
autoindex on; #
autoindex_exact_size off; #
autoindex_localtime on; #
location ~* \.(eot|otf|ttf|woff)$ {
add_header Access-Control-Allow-Origin *;
} }

nginx 下 bootstrap fa 字体异常问题的更多相关文章

  1. 编码 - 坑 - win10 下采用 utf-8, 导致 gitbash 中文字体异常, 待解决

    blog01 概述 使用 git 中, 遇到一个坑 背景 最近遇到一个 编码转换 问题 本来也 一知半解 要是有人能给我讲讲就好了 环境 win10 1903 git 2.20.1 1. 问题 概述 ...

  2. nginx下目录浏览及其验证功能配置记录

    工作中常常有写不能有网页下载东西的需求,在Apache下搭建完成后直接导入文件即可达到下载/显示文件的效果;而Nginx的目录列表功能默认是关闭的,如果需要打开Nginx的目录列表功能,需要手动配置, ...

  3. Nginx下编译PHP+Mysql

    先说一下PHP在Apache和Nginx下所扮演的角色 apache一般是把php当做自己的一个模块来启动的. 而nginx则是把http请求变量(如get,user_agent等)转发给 php进程 ...

  4. Linux下添加windows字体

    在Linux下使用wqy字体,在视觉效果上就已近很好了,其实没有必要添加windows字体.但是显然有些人(比如领导,^..^)就喜欢宋体.楷体,所以添加windows字体有时还是需要的,幸运的是这件 ...

  5. nginx下目录浏览及其验证功能、版本隐藏等配置记录

    工作中常常有写不能有网页下载东西的需求,在Apache下搭建完成后直接导入文件即可达到下载/显示文件的效果;而Nginx的目录列表功能默认是关闭的,如果需要打开Nginx的目录列表功能,需要手动配置, ...

  6. 详解Net Core Web Api项目与在NginX下发布

    前言 本文将介绍Net Core的一些基础知识和如何NginX下发布Net Core的WebApi项目. 测试环境 操作系统:windows 10 开发工具:visual studio 2019 框架 ...

  7. 安全防范:nginx下git引发的隐私泄露问题

    安全防范:nginx下git引发的隐私泄露问题 1   安全事件 最近阿里云服务器后台管理系统中收到一条安全提示消息,系统配置信息泄露: http://my.domain.com/.git/confi ...

  8. 如何在Nginx下配置PHP程序环境

    1.nginx与PHP的关系 首先来看nginx与php的关系, FastCGI的关系(而不是像apache那样安装成nginx的模块) FastCGI的意思是, 快速的通用网关接口:CGI Comm ...

  9. 解决win8 下 eclipse 中文字体太小的问题

    一.把字体设置为Courier New  操作步骤:打开Elcipse,点击菜单栏上的“Windows”——点击“Preferences”——点击“Genneral”——点击“Appearance”— ...

随机推荐

  1. 使用Diagnose服务查看Azure网站诊断信息

    注意:当前操作只针对"基本"和"标准"模式的网站(也就是有独立实例的网站) 登陆网站的kudu模式:http://{yoursitename}.scm.chin ...

  2. 最近这么火的iOS视频直播

    快速集成iOS基于RTMP的视频推流 http://www.jianshu.com/p/8ea016b2720e iOS视频直播初窥:高仿<喵播APP> http://www.jiansh ...

  3. python 函数基础介绍

    函数是对程序逻辑进行结构化或过程化的一种编程方法.能将整块代码巧妙地隔离成易于管理的小块,把重复代码放在函数中而不是进行大量的拷贝. 一.函数创建 def 函数创建格式如下: def function ...

  4. C#和SQL实现的字符串相似度计算代码分享

    http://www.jb51.net/article/55941.htm C#实现: 复制代码 代码如下: #region 计算字符串相似度        /// <summary>   ...

  5. Python基础之【第一篇】

    Python简介: python的创始人为吉多·范罗苏姆(Guido van Rossum).1989年的圣诞节期间,吉多·范罗苏姆为了在阿姆斯特丹打发时间,决心开发一个新的脚本解释程序,作为ABC语 ...

  6. 全选,全不选,反选的js实现

    全选练习       ** 使用复选框上面一个属性判断是否选中                   - checked属性                   - checked=true:选中    ...

  7. jquery插件写法

    //传统写法 //全局方法 ;(function($){ $.method = function(){ } //or $.obj = { method1:function(){}, method2:f ...

  8. mysql sql语句为表批量增加字段

    方法一 这里可以使用事务 bagin; //事务开始 alter table em_day_data add f_day_house7 int(11); alter table em_day_data ...

  9. nodejs开发指南读后感

    nodejs开发指南读后感 阅读目录 使用nodejs创建http服务器; supervisor的使用及nodejs常见的调式代码命令了解; 了解Node核心模块; ejs模板引擎 Express 理 ...

  10. 开源一个动态解析protobuf的工具

    好久没写博客了,主要是这一年技术没啥长进都打杂了,还有就是生活琐事越来越多,人也越来越懒了…… 之前项目中用到了Protobuf,然后测试发现这玩意不好测,总不能每次定个协议或者改下都要编译Java代 ...