简单谈谈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 相关文章推荐
配置支持SSI
Nov 25 PHP
PHP Mysql编程之高级技巧
Aug 27 PHP
PHP伪造referer实例代码
Sep 20 PHP
PHP开发负载均衡指南
Jul 17 PHP
php读取目录及子目录下所有文件名的方法
Oct 20 PHP
详解PHP实现定时任务的五种方法
Jul 25 PHP
CI框架中类的自动加载问题分析
Nov 21 PHP
PHP中的use关键字及文件的加载详解
Nov 28 PHP
利用ajax和PHP实现简单的流程管理
Mar 23 PHP
php中类和对象:静态属性、静态方法
Apr 09 PHP
php-fpm超时时间设置request_terminate_timeout资源问题分析
Sep 27 PHP
php使用json-schema模块实现json校验示例
Sep 28 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
基于asp+ajax和数据库驱动的二级联动菜单
2010/05/06 PHP
php中apc缓存使用示例
2013/12/25 PHP
PHP+MySQL存储数据常见中文乱码问题小结
2016/06/13 PHP
php实现在新浪云中使用imagick生成缩略图并上传的方法
2016/09/26 PHP
PHP观察者模式定义与用法实例分析
2019/03/22 PHP
JS控件的生命周期介绍
2012/10/22 Javascript
jQuery渐变发光导航菜单的实例代码
2013/03/27 Javascript
js实现全屏漂浮广告移入光标停止移动
2013/12/02 Javascript
购物车选中得到价格实现示例
2014/01/26 Javascript
js+css实现有立体感的按钮式文字竖排菜单效果
2015/09/01 Javascript
浅析创建javascript对象的方法
2016/05/13 Javascript
微信小程序 欢迎页面的制作(源码下载)
2017/01/09 Javascript
浅谈angular4 ng-content 中隐藏的内容
2017/08/18 Javascript
Vue实例中生命周期created和mounted的区别详解
2017/08/25 Javascript
浅析js中mvvm模式实现的原理
2018/10/06 Javascript
微信小程序实现购物车代码实例详解
2019/08/29 Javascript
微信小程序如何加载数据库真实数据的实现
2020/03/04 Javascript
ES11屡试不爽的新特性,你用上了几个
2020/10/21 Javascript
[47:46]完美世界DOTA2联赛 Magma vs GXR 第三场 11.07
2020/11/10 DOTA
python共享引用(多个变量引用)示例代码
2013/12/04 Python
python实现从web抓取文档的方法
2014/09/26 Python
Python基于twisted实现简单的web服务器
2014/09/29 Python
Python读取Word(.docx)正文信息的方法
2018/03/15 Python
mac 安装python网络请求包requests方法
2018/06/13 Python
Python使用pymongo模块操作MongoDB的方法示例
2018/07/20 Python
如何通过50行Python代码获取公众号全部文章
2019/07/12 Python
Python序列化与反序列化pickle用法实例
2019/11/11 Python
Python 字符串处理特殊空格\xc2\xa0\t\n Non-breaking space
2020/02/23 Python
python3 配置logging日志类的操作
2020/04/08 Python
Tensorflow tensor 数学运算和逻辑运算方式
2020/06/30 Python
伦敦高级内衣品牌:Agent Provocateur(大内密探)
2016/08/23 全球购物
马来西亚户外装备商店:PTT Outdoor
2019/07/13 全球购物
五一劳动节演讲稿
2014/09/12 职场文书
2014年学校党建工作汇报材料
2014/11/02 职场文书
react使用antd的上传组件实现文件表单一起提交功能(完整代码)
2021/06/29 Javascript
MySQL分库分表详情
2021/09/25 MySQL