惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

T
The Blog of Author Tim Ferriss
Know Your Adversary
Know Your Adversary
P
Palo Alto Networks Blog
D
Darknet – Hacking Tools, Hacker News & Cyber Security
K
Kaspersky official blog
L
LINUX DO - 热门话题
P
Proofpoint News Feed
P
Privacy & Cybersecurity Law Blog
Google DeepMind News
Google DeepMind News
Attack and Defense Labs
Attack and Defense Labs
Cisco Talos Blog
Cisco Talos Blog
AI
AI
L
LINUX DO - 最新话题
H
Heimdal Security Blog
Hacker News: Ask HN
Hacker News: Ask HN
Webroot Blog
Webroot Blog
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
The GitHub Blog
The GitHub Blog
I
Intezer
Blog — PlanetScale
Blog — PlanetScale
有赞技术团队
有赞技术团队
S
Securelist
博客园_首页
IT之家
IT之家
Schneier on Security
Schneier on Security
博客园 - 叶小钗
罗磊的独立博客
WordPress大学
WordPress大学
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
MongoDB | Blog
MongoDB | Blog
P
Proofpoint News Feed
阮一峰的网络日志
阮一峰的网络日志
A
Arctic Wolf
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
W
WeLiveSecurity
The Register - Security
The Register - Security
D
DataBreaches.Net
S
Security @ Cisco Blogs
Security Archives - TechRepublic
Security Archives - TechRepublic
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
腾讯CDC
Recorded Future
Recorded Future
NISL@THU
NISL@THU
N
News and Events Feed by Topic
T
Tailwind CSS Blog
N
News and Events Feed by Topic
Cyberwarzone
Cyberwarzone
T
Tor Project blog
www.infosecurity-magazine.com
www.infosecurity-magazine.com

茂茂の部落格

忘记续费,部落格挂了 - 茂茂の部落格 - 悲喜自渡,他人难悟 Merry Christmas - 茂茂の部落格 - 悲喜自渡,他人难悟 Grafana教程2 - 茂茂の部落格 - 悲喜自渡,他人难悟 docker的iptables规则 - 茂茂の部落格 - 悲喜自渡,他人难悟 Grafana学习思维导图 - 茂茂の部落格 - 悲喜自渡,他人难悟 Grafana学习记录一 - 茂茂の部落格 - 悲喜自渡,他人难悟 关于最近 - 茂茂の部落格 - 悲喜自渡,他人难悟 服务器被墙了 - 茂茂の部落格 - 悲喜自渡,他人难悟 .NET开发招聘简章 - 茂茂の部落格 - 悲喜自渡,他人难悟 markdown插入音视频 - 茂茂の部落格 - 悲喜自渡,他人难悟 docker-compose安装Halo博客 - 茂茂の部落格 - 悲喜自渡,他人难悟 Gravatar本站镜像 - 茂茂の部落格 - 悲喜自渡,他人难悟 迁移Halo博客的教程 - 茂茂の部落格 - 悲喜自渡,他人难悟 centos8 Cannot prepare internal mirrorlist: No URLs in mirrorlist - 茂茂の部落格 邮箱服务更换为MailCow - 茂茂の部落格 - 悲喜自渡,他人难悟 nextcloud配置文件 - 茂茂の部落格 - 悲喜自渡,他人难悟 使用Docker安装Mastodon - 茂茂の部落格 - 悲喜自渡,他人难悟 Misskey 设置和安装指南 - 茂茂の部落格 - 悲喜自渡,他人难悟 Linux下通过 rm -f 删除大量文件时报错:Argument list too long - 茂茂の部落格
本站优化附件使用webp输出 - 茂茂の部落格 - 悲喜自渡,他人难悟
茂茂 · 2022-03-14 · via 茂茂の部落格

|

来源 https://halo.run/archives/halo-and-webp.html
部分图片体积较大,所以加载较慢,然后看到了这个
所以尝试优化图片输出

下载WebpServerGo

https://github.com/webp-sh/webp_server_go/releases
在此地址下载最新的Webp Server Go执行文件

赋予执行权限

赋予下载回来的文件执行权限

chmod+x webp-server-linux-amd64

生成配置文件

在webp-server-linux-amd64的当前目录生成配置文件

./webp-server-linux-amd64 -dump-config > config.json

然后修改生成的config.json为以下内容

{
        "HOST": "127.0.0.1",
        "PORT": "3333",
        "QUALITY": "80",
        "IMG_PATH": "/your/halo/path/.halo",
        "EXHAUST_PATH": "/your/halo/path/.halo/cache",
        "ALLOWED_TYPES": ["jpg","png","jpeg"]
}

使用Supervisor托管启动

添加Supervisor子配置文件

[program:webpserver]
command=/your/webservergo/path/webp-server-linux-amd64 --config=/your/webservergo/path/config.json
directory=/your/webservergo/path
autorestart=true
startsecs=3
startretries=3
stdout_logfile=/your/log/path/webpserver.out.log
stderr_logfile=/your/log/path/webpserver.err.log
stdout_logfile_maxbytes=2MB
stderr_logfile_maxbytes=2MB
user=root
priority=999
numprocs=1
process_name=%(program_name)s_%(process_num)02d

Nginx代理

我使用的docker部署的halo,然后使用nginx反向代理,所以此处贴出nginx的反向代理配置
打开halo博客的nginx反向代理,添加如下部分

location ^~ /upload/ {
        proxy_pass http://127.0.0.1:3333;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_hide_header X-Powered-By;
        proxy_set_header HOST $http_host;
        add_header Cache-Control 'no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0';
}

接下来就是测试啦
很简单,打开你的博客,再F12启动DevTool
效果如下图
firefox snap

可以看到上传的图片都被转换成webp输出啦~

提醒

{
        "HOST": "127.0.0.1",
        "PORT": "3333",
        "QUALITY": "80",
        "IMG_PATH": "/your/halo/path/.halo",
        "EXHAUST_PATH": "/your/halo/path/.halo/cache",
        "ALLOWED_TYPES": ["jpg","png","jpeg","gif","bmp","mp3","mp4"]
}

以上参数中的ALLOWED_TYPES后缀可以放行其他类型文件,比如我的附件中会包含MP3和MP4文档,如果不放行,在代理后会出现File extension not allowed!的提醒,同时对应媒体文件也无法加载出来。