?薅羊毛哇~5分钟打造属于自己的免费自动化图床工具

0170

  • 你是否平时有使用图床的需求？
  • 你是否需要自己购买服务器？或使用类似七牛云的免费额度？
  • 你是否每天要自己手动上传图片到图床，然后还要一个个复制链接？

今天教你一个命令行即可实现上面所有的功能，一秒钟搞定⚡⚡⚡

话不多说，show me the code

先看如何使用

  • 先给大家看下最终使用的形式
    image.png
  • 电脑的任意位置，在终端里输入以下命令，搞定！
lzb upload /Users/jerome/Desktop/nest__nest-pipeline.jpeg
lzb upload /Users/jerome/Desktop/nest__nest-pipeline.jpeg
lzb upload /Users/jerome/Desktop/nest__nest-pipeline.jpeg
  • lzb 是自己封装的命令行名字，大家自己随便起即可（相关命令行知识，这里不介绍，网上很多，就是Command包即可）
  • upload 是命令的 action，也是自己起的
  • 后面直接跟上你要上传的图片地址即可
  • ?图片已经上传成功，并且直接返回链接了！是不是超级爽?

image.png

如何实现

1. 先在自己的 github上创建一个项目

  • 这个名字是固定的，${用户名}.github.io 即可（不懂的可以参考 github pages相关文档) 可以直接域名访问了，这个也是免费的图床
  • 例如我的：

image.png

2. 建好后把这项目 clone 到本地，方便后续上传

  1. 后续就是把图片自动上传到这个项目中

3. 开始我们最主要的正文了，写自动化命令行

  1. 初始化命令行的部分，这里就不赘述了，相关的请看下 command.js 这个库
  2. 这里仅写最主要的 upload 命令实现的部分
  3. 注意之前执行 upload 命令后，跟着的是 本地要上传的文件路径，也就是 filePath
import fs from 'fs';
import path from 'path';
import {exec} from 'child_process';
interface Arg {
    filePath:string;
    program:{
        server:string
        destPath:string
    };
}
const GITHUB_REPO_LOCAL = '/Users/jerome/rowin90.github.io'; // 这个就是我本地 clone 下来的那个之前建好的仓库的地址
export const handleUpload = async ({filePath, program}:Arg) => {
    const type:'github' | 'tencent' = 'github';
    // 如果你又其他的图床，你可以自己去定义
    // 我这里只写上传到 github，因为可以薅羊毛
    if (type === 'github') {
        uploadToGithub(filePath);
    } 
};
function uploadToGithub(filePath) {
    const virtualFileName = path.basename(filePath); // 获取文件名
    const [folderName, fileName] = virtualFileName.split('__'); // 我这边自己约束了，文件名有 "__"的，那么 "__" 前表示要放的文件夹， "__"后是真正的文件名 
    // 如，你的图片名称是 “nest__nest-pipeline.jpeg” ,那表示要把图片放在 nest目录下，文件名是 nest-pipeline.jpeg
    // 这么做也是为了方便管理归类，不然后面图片都堆积在根目录，当然你可以不用，这只是我自己的约定
    let localRepoPath = `${GITHUB_REPO_LOCAL}/images/`; // 目标路径
    if (folderName) {
        // 如果有文件夹
        localRepoPath = `${GITHUB_REPO_LOCAL}/images/${folderName}`; // 目标路径
    }
    function runCommand(command):Promise<void> {
        return new Promise((resolve, reject) => {
            exec(command, (error, stdout) => {
                if (error) {
                    console.error(`exec error: ${error}`);
                    reject(error);
                } else {
                    console.log(stdout.trim());
                    resolve();
                }
            });
        });
    }
    // 创建文件夹，如果已存在则忽略
    runCommand(`mkdir -p ${localRepoPath}`)
        .then(() => runCommand(`cp ${filePath} ${localRepoPath}`))
        .then(() => runCommand(`mv ${localRepoPath}/${virtualFileName}  ${localRepoPath}/${fileName}`))
        .then(() => runCommand(`cd ${GITHUB_REPO_LOCAL} && git add . && git commit -m 'add: ${fileName}' && git push`))
        .then(() => console.log(`访问地址: https://rowin90.github.io/images/${folderName && folderName + '/'}${fileName}`))
        .catch((err) => console.error(err));
}
import fs from 'fs';
import path from 'path';
import {exec} from 'child_process';

interface Arg {
    filePath:string;
    program:{
        server:string
        destPath:string
    };
}

const GITHUB_REPO_LOCAL = '/Users/jerome/rowin90.github.io'; // 这个就是我本地 clone 下来的那个之前建好的仓库的地址

export const handleUpload = async ({filePath, program}:Arg) => {


    const type:'github' | 'tencent' = 'github';
    // 如果你又其他的图床，你可以自己去定义
    // 我这里只写上传到 github，因为可以薅羊毛
    if (type === 'github') {
        uploadToGithub(filePath);
    } 
};

function uploadToGithub(filePath) {

    const virtualFileName = path.basename(filePath); // 获取文件名

    const [folderName, fileName] = virtualFileName.split('__'); // 我这边自己约束了，文件名有 "__"的，那么 "__" 前表示要放的文件夹， "__"后是真正的文件名 
    // 如，你的图片名称是 “nest__nest-pipeline.jpeg” ,那表示要把图片放在 nest目录下，文件名是 nest-pipeline.jpeg
    // 这么做也是为了方便管理归类，不然后面图片都堆积在根目录，当然你可以不用，这只是我自己的约定

    let localRepoPath = `${GITHUB_REPO_LOCAL}/images/`; // 目标路径
    if (folderName) {
        // 如果有文件夹
        localRepoPath = `${GITHUB_REPO_LOCAL}/images/${folderName}`; // 目标路径
    }

    function runCommand(command):Promise<void> {
        return new Promise((resolve, reject) => {
            exec(command, (error, stdout) => {
                if (error) {
                    console.error(`exec error: ${error}`);
                    reject(error);
                } else {
                    console.log(stdout.trim());
                    resolve();
                }
            });
        });
    }

    // 创建文件夹，如果已存在则忽略
    runCommand(`mkdir -p ${localRepoPath}`)
        .then(() => runCommand(`cp ${filePath} ${localRepoPath}`))
        .then(() => runCommand(`mv ${localRepoPath}/${virtualFileName}  ${localRepoPath}/${fileName}`))
        .then(() => runCommand(`cd ${GITHUB_REPO_LOCAL} && git add . && git commit -m 'add: ${fileName}' && git push`))
        .then(() => console.log(`访问地址: https://rowin90.github.io/images/${folderName && folderName + '/'}${fileName}`))
        .catch((err) => console.error(err));
}
import fs from 'fs';
import path from 'path';
import {exec} from 'child_process';

interface Arg {
    filePath:string;
    program:{
        server:string
        destPath:string
    };
}

const GITHUB_REPO_LOCAL = '/Users/jerome/rowin90.github.io'; // 这个就是我本地 clone 下来的那个之前建好的仓库的地址

export const handleUpload = async ({filePath, program}:Arg) => {


    const type:'github' | 'tencent' = 'github';
    // 如果你又其他的图床，你可以自己去定义
    // 我这里只写上传到 github，因为可以薅羊毛
    if (type === 'github') {
        uploadToGithub(filePath);
    } 
};

function uploadToGithub(filePath) {

    const virtualFileName = path.basename(filePath); // 获取文件名

    const [folderName, fileName] = virtualFileName.split('__'); // 我这边自己约束了，文件名有 "__"的，那么 "__" 前表示要放的文件夹， "__"后是真正的文件名 
    // 如，你的图片名称是 “nest__nest-pipeline.jpeg” ,那表示要把图片放在 nest目录下，文件名是 nest-pipeline.jpeg
    // 这么做也是为了方便管理归类，不然后面图片都堆积在根目录，当然你可以不用，这只是我自己的约定

    let localRepoPath = `${GITHUB_REPO_LOCAL}/images/`; // 目标路径
    if (folderName) {
        // 如果有文件夹
        localRepoPath = `${GITHUB_REPO_LOCAL}/images/${folderName}`; // 目标路径
    }

    function runCommand(command):Promise<void> {
        return new Promise((resolve, reject) => {
            exec(command, (error, stdout) => {
                if (error) {
                    console.error(`exec error: ${error}`);
                    reject(error);
                } else {
                    console.log(stdout.trim());
                    resolve();
                }
            });
        });
    }

    // 创建文件夹，如果已存在则忽略
    runCommand(`mkdir -p ${localRepoPath}`)
        .then(() => runCommand(`cp ${filePath} ${localRepoPath}`))
        .then(() => runCommand(`mv ${localRepoPath}/${virtualFileName}  ${localRepoPath}/${fileName}`))
        .then(() => runCommand(`cd ${GITHUB_REPO_LOCAL} && git add . && git commit -m 'add: ${fileName}' && git push`))
        .then(() => console.log(`访问地址: https://rowin90.github.io/images/${folderName && folderName + '/'}${fileName}`))
        .catch((err) => console.error(err));
}
  • 写完了，是不是很简单?

4. 看看效果

  1. 执行命令
lzb upload /Users/jerome/Desktop/nest__nest-pipeline.jpeg
lzb upload /Users/jerome/Desktop/nest__nest-pipeline.jpeg
lzb upload /Users/jerome/Desktop/nest__nest-pipeline.jpeg
  1. 查看本地 clone下来的目录，是不是上传了

image.png

  1. 再看下返回的执行完结果

image.png

  1. 我们直接访问返回的地址

image.png

大功告成 ！！???

其他

  • 其实我们把文件上传到自己建的 github.io 的仓库，github CI/CD自动帮我们构建和发布，所有上传后，稍微等一会，大概不到1分钟，就能看到自己上传的图片了，是不是很爽

image.png

  • 几乎不需要任何成本，即可拥有属于自己的免费图床，而且1秒上传，小伙伴们快快行动吧！

© 版权声明
文章版权归作者所有，未经允许请勿转载，侵权请联系 admin@trc20.tw 删除。
THE END
前端
# Node.js# 命令行
喜欢就支持一下吧
点赞0

Warning: mysqli_query(): (HY000/3): Error writing file '/tmp/MY93Lodc' (Errcode: 28 - No space left on device) in /www/wwwroot/583.cn/wp-includes/class-wpdb.php on line 2345
admin的头像-五八三
相关推荐
评论 抢沙发
头像
欢迎您留下宝贵的见解！
提交
头像

昵称

图形验证码
取消
昵称

请填写用户信息：

  • 昵称(必填)
  • 邮箱(必填)
代码

请输入代码：

确认
图片
文章目录
文章目录
热门推荐