TinyPNG 一键脚本

June 11, 2020

公司的前端小伙伴经常需要通过 TinyPNG 将切图素材进行压缩以保证前端页面的加载速度。

在这之前，每次压缩都是枯燥的机械操作：

打开网址 -> 拖动图片进入网站 -> 等待压缩完成 -> 下载压缩包 -> 解压缩 -> 替换静态资源

网站一次性只能压缩 20 张 5MB 以内的图片

所以，应该让程序自动化。

Shell 脚本

公司开发都是 macOS 所以这次我们只需要一个 Shell 脚本。

#!/bin/bash
keys=(XvqD6HrskNd0FqyMdfcQbymGNYmJB8zb SNhNpxDlCNm9VjtxqWQGd9dTyf9jCBRY)

echo -e '\n\033[31m- - - - - - - - - - - - - - - - - - - - - -\033[0m\n'
files=()
for filename in *
do 
    if [[ $filename =~ \.(jpg|png|jpeg)$ ]];then
        files[${#files[*]}]=$filename
    fi
done

echo -e "\033[34m${files[@]}\033[0m"
echo -e '\n是否将以上图片进行压缩？回车以继续 ctl+c 取消'
read -p ''

echo -e '开始压缩，请等待...\n'

for filename in ${files[@]}
do
{
    key=${keys[$RANDOM%${#keys[*]}]}
    rep=`curl https://api.tinify.com/shrink --user api:$key --data-binary '@'${filename} -s`
    [[ $rep =~ url\":\"(.*)\" ]]
    url=${BASH_REMATCH[1]}
    wget -q -O ${filename} ${url}
    echo -e "\033[34m${filename} 已完成\033[0m"
} &
done
wait
echo -e "\n完成"

代码比较简单就不必做注释说明，但使用时要注意以下：

建议将未压缩的切图放入一个文件夹单独执行命令，压缩后移入项目目录。
由于循环使用了 & 操作，会导致开始后每张图片一个独立“进程”进行压缩以节约时间，此时 ctrl+c 只能退出最外部等待中的“进程”无法退出“子进程”。

懒人命令

为了更方便大家使用，提供一个线上脚本可一行命令直接使用，脚本内包含约 35 个 Key，每月每 Key 可以压缩 500 张图片，请大家合理使用，避免滥用，谢谢。

bash -c "$(curl -s cdn.huguotao.com/tinypng.sh)"

进入图片目录后执行命令即可

Reference

TinyPNG - API Reference

文章列表评论