创建自己的favicon.ico供浏览器获取避免404

最新推荐文章于 2024-05-15 23:28:03 发布

starcraft501

最新推荐文章于 2024-05-15 23:28:03 发布

阅读量4.8k

点赞数

分类专栏： Favicon 文章标签： NodeJS favicon.ico Express

本文链接：https://blog.csdn.net/starcraft501/article/details/82719655

版权

Favicon 专栏收录该内容

0 篇文章 0 订阅

订阅专栏

现象：

打开网站主页，在chrome浏览器的console中出现以下错误：

Failed to load resource: the server responded with a status of 404 (Not Found) :3000/favicon.ico

Not Found

404

NotFoundError: Not Found
    at C:\Users\Jet\WebstormProjects\HelloWorld\app.js:27:8
    at Layer.handle [as handle_request] (C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\layer.js:95:5)
    at trim_prefix (C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:317:13)
    at C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:284:7
    at Function.process_params (C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:335:12)
    at next (C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:275:10)
    at C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:635:15
    at next (C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:260:14)
    at Function.handle (C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:174:3)
    at router (C:\Users\Jet\WebstormProjects\HelloWorld\node_modules\express\lib\router\index.js:47:12)

原因：

该项目没有favicon.ico这个文件

解决办法：

方案1

1. 在线生成自己的favicon.ico

https://tool.lu/favicon/

2. 将生成的favicon.ico放在根目录，即public文件夹下

3. 在模板的Head标签中引入favicon.ico

<head>

</head>

方案2

在模板的Head标签中使用以下链接

本地服务器本机测试：

http://localhost:3000/favicon.ico 确保资源路径正确

http://localhost:3000/

本地服务器外机测试：

http://192.168.0.2:3000/

注意：

测试过程中注意清除浏览器缓存，在chrome中可以通过F12查看浏览器对favicon.ico的请求

在第一次请求加载favicon.ico到本地后，chrome会自动缓存图标，后面不会再请求favicon.ico，所以服务端有favicon.ico刷新的时候，需要在浏览器端清除缓存后，才会显示新的图标, 有时还需要关闭浏览器才会生效！！！

starcraft501

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
创建自己的favicon.ico供浏览器获取避免404

现象：打开网站主页，在chrome浏览器的console中出现以下错误：Failed to load resource: the server responded with a status of 404 (Not Found) :3000/favicon.ico Not Found404NotFoundError: Not Found at C:\U...
复制链接

扫一扫

专栏目录