简单谈谈favicon


Posted in PHP onJune 10, 2015

favicon.ico介绍

favicon.ico是个什么东西呢,也许见得太多都习以为常了(我就是这样,直到写这篇文章之前才知道),看看维基百科的解释:

Favicon是favorites icon的缩写,亦被称为website icon(网页图标)、page icon(页面图标)或urlicon(URL图标),下面是链接 http://zh.wikipedia.org/wiki/Favicon

其实说白了就是这个东西,大部分网站都会在打开的浏览器tab最左侧显示这个小图标,这个就是favicon.ico

简单谈谈favicon

这个图标怎么设置的呢,有多少同学跟我一样对这个小细节习以为常了,但是不清楚怎么设置举个手(这里检讨下自己,有好多细节东西把脸都能碰肿,但我却不真正的了解他,更可怕的是我的潜意识里认为我了解他......)。

favicon设置

这个怎么设置呢,设置方法很简单,有两种法子:

默认放置在服务器根目录下面

就是将文件命名为favicon.ico并放在网站根目录下就可以,浏览器会自动方请求去获取http://host/favicon.ico,这个请求在浏览器中通过F12是看不到的,需要借助其他工具(比如说Fiddler)去看,或者打开服务器访问日志,比如我这个,nginx日志中会显示网页图标请求
"13/May/2015:16:07:31 +0800" "192.168.X.X" "test.test.com" "200" "GET /favicon.ico HTTP/1.1" "4409" ......

通过link标签修正网页图标位置和名称

这种方法就是通过html的link标签设置网页图表的位置和名称,就像下面这样
<link href="favicon_baoman.ico" type="image/x-icon" rel="icon">

简单谈谈favicon

注意点

浏览器会缓存图标的信息,firefox我试了下是每隔一段时间(2分钟左右)就会请求一次favicon,chrome要删除数据才可以重新请求~~

这个有什么影响呢

发现这个问题是因为PHP框架,PHP框架通过pathinfo去解析路由,路由方式为【mod/controller.method】,如果不匹配的话就记录日志并返回404,我访问一个正确的路径也会报错说是路由不存在,但是接口返回是ok的,访问一个错误的路由会记录两条错误日志,这个是怎么回事呢,下面是我的nginx配置

server {
   listen  80;
   server_name test.test.com;

   location / {
     root /export/adsz/boss/php/sphp;
     fastcgi_pass  127.0.0.1:9000;
     fastcgi_index  index.php;
     fastcgi_split_path_info ^((?U).+\.php)(/?.+)$;
     fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
     fastcgi_param PATH_INFO $fastcgi_path_info;
     include fastcgi_params;
     rewrite ^/(.*)$  /index.php/$1 break;
   }
 }

nginx配置导致了这个问题的存在,浏览器请求一个接口的时候,会默认带上http://test.test.com/favicon.ico,这个时候报出路由错误就想的通了,浏览器发出两条请求,一条使我们想要的,另一条就是这个ico网页图标请求,这个问题解决方法也很简单,只需要在配置中添加这个图表或者将favicon请求定位到其他地方:

server {
   listen  80;
   server_name test.test.com;
  location = /favicon.ico {
    root /wwroot/public/images/;
  }
   location / {
     root /wwroot/;
     fastcgi_pass  127.0.0.1:9000;
     fastcgi_index  index.php;
     fastcgi_split_path_info ^((?U).+\.php)(/?.+)$;
     fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
     fastcgi_param PATH_INFO $fastcgi_path_info;
     include fastcgi_params;
     rewrite ^/(.*)$  /index.php/$1 break;
   }
 }

总结

找到这个原因并修改后,我又仔细看了看nginx配置,发现其他虚拟主机都有配置这个favicon.ico的匹配规则!?濉!!#?芙嵯拢?褪且?嗫纯矗?嘞胂胛?裁矗?灰?院芏喽?魇?バ巳ぁ⒓?植还?/p>

以上所述就是本文的全部内容了,希望大家能够喜欢。

PHP 相关文章推荐
PHP中register_globals参数为OFF和ON的区别(register_globals 使用详解)
Feb 05 PHP
Eclipse中php插件安装及Xdebug配置的使用详解
Apr 25 PHP
浅谈PHP强制类型转换,慎用!
Jun 06 PHP
如何使用php输出时间格式
Aug 31 PHP
php从数组中随机选择若干不重复元素的方法
Mar 14 PHP
CodeIgniter配置之config.php用法实例分析
Jan 19 PHP
PHP实现统计在线人数功能示例
Oct 15 PHP
PHP那些琐碎的知识点(整理)
May 20 PHP
PHP中phar包的使用教程
Jun 14 PHP
PHP给前端返回一个JSON对象的实例讲解
May 31 PHP
PHP封装的完整分页类示例
Aug 21 PHP
PHP读取Excel内的图片(phpspreadsheet和PHPExcel扩展库)
Nov 19 PHP
简单谈谈php中的unicode和utf8编码
Jun 10 #PHP
PHP中生成UUID自定义函数分享
Jun 10 #PHP
php使用for语句输出三角形的方法
Jun 09 #PHP
php生成图片验证码
Jun 09 #PHP
php判断用户是否手机访问代码
Jun 08 #PHP
浅谈PHP中Stream(流)
Jun 08 #PHP
php实现有趣的人品测试程序实例
Jun 08 #PHP
You might like
蝙蝠侠:侠影之谜
2020/03/04 欧美动漫
PHP文件大小格式化函数合集
2014/03/10 PHP
php中unserialize返回false的解决方法
2014/09/22 PHP
CodeIgniter框架数据库基本操作示例
2018/05/24 PHP
jQuery获取Select选择的Text和Value(详细汇总)
2013/01/25 Javascript
jQuery的attr与prop使用介绍
2013/10/10 Javascript
Checbox的操作含已选、未选及判断代码
2013/11/07 Javascript
把字符串按照特定的字母顺序进行排序的js代码
2014/01/28 Javascript
express的中间件cookieParser详解
2014/12/04 Javascript
JavaScript语言对Unicode字符集的支持详解
2014/12/30 Javascript
详谈LABJS按需动态加载js文件
2015/05/07 Javascript
jQuery实现的Tab滑动选项卡及图片切换(多种效果)小结
2015/09/14 Javascript
jquery实现加载进度条提示效果
2015/11/23 Javascript
七个不允许错过的jQuery小技巧
2015/12/21 Javascript
vue.js整合mint-ui里的轮播图实例代码
2017/12/27 Javascript
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
2018/04/12 jQuery
vue-devtools的安装步骤
2018/04/23 Javascript
浅谈Node框架接入ELK实践总结
2019/02/22 Javascript
微信小程序常用赋值方法小结
2019/04/30 Javascript
layui 地区三级联动 form select 渲染的实例
2019/09/27 Javascript
Javascript ParentNode和ChildNode接口原理解析
2020/03/16 Javascript
JS求解两数之和算法详解
2020/04/28 Javascript
vue proxy 的优势与使用场景实现
2020/06/15 Javascript
Vue中的this.$options.data()和this.$data用法说明
2020/07/26 Javascript
[03:00]DOTA2-DPC中国联赛1月18日Recap集锦
2021/03/11 DOTA
Python中os.path用法分析
2015/01/15 Python
eclipse创建python项目步骤详解
2019/05/10 Python
Django生成PDF文档显示在网页上以及解决PDF中文显示乱码的问题
2019/07/04 Python
Python 实现数据结构-堆栈和队列的操作方法
2019/07/17 Python
Python generator生成器和yield表达式详解
2019/08/08 Python
解决django框架model中外键不落实到数据库问题
2020/05/20 Python
为什么说python更适合树莓派编程
2020/07/20 Python
python list等分并从等分的子集中随机选取一个数
2020/11/16 Python
localstorage和sessionstorage使用记录(推荐)
2017/05/23 HTML / CSS
十月份红领巾广播稿
2014/01/22 职场文书
医院病假条范文
2015/08/17 职场文书