喵爸的小作坊

Appearance

不想白嫖了，自己动手搭个图床 MinIO + PicGo + Typora ​

前世的原因 ​

相信很多同学跟我一样，使用Typora做技术文档，Blog 的创作，然后用类似PicGO这样的工具上传到Github，其实这是个不错的做法。

好处就是免费，简单，方便，缺点呢，自己本地看还行，因为我知道大家都会武功或者借助一些技巧，而且呢发文到各大平台问题也不大。毕竟各大平台的 Markdown 文档编辑器会自动给我们上传图片到他们自己的图床。

如果是在自己 Blog 站点直接发出去呢，里面图片地址是 https://raw.githubusercontent.com/， 那么对于网络条件不好的用户，就会显示不出来或者加载很慢，毕竟不是谁都会武功的对吧。

等等，我有个好主意！😈😈

【那我把我 markdown 里面的链接都替换成平台的不就好了么？】

！！！像我这样，有这种想法呢也正常的。

试一试

平台还是比我们要聪明点啦。我们发现把地址复制出来是可以正常显示的。

这里肯定又有学习不错的大聪明说，我学过，无非是别人加了防盗链，之前 gitee 也是。我们把Header里面的Referer改成平台自己支持的域名就行了。

兄弟，你学的很好，那你就这么玩哈。

自己演绎了个剧本大家不要见笑。

其实呢，对于各大平台来说不管是Gitee，还是知识社区，进行一些防盗链是非常正常的，毕竟服务器资源都是要花钱的，也会有一些其他风险，我觉得作为行业内的还是应该理解的，只是Github这样的比较另类。

今生的解决办法 ​

那么怎么解决呢，用Github的确是不行了。

买个OSS服务吧。可以是可以，花点钱，趁现在618各大云厂商都在推出促销服务，比较现在茅台价格都被电商玩出事了对吧，有需要的同学可以去看看，专属优惠

其实也是个不错的方案，毕竟对象存储服务就是用来存放文件，图片，日志等东西的，而且选好存储类型的话，预算还是不高的，玩过云资源的都知道，不管是哪种类型的资源，存储本身是不贵的，流量才贵。所以大家可以自己权衡下，我也没算过账

【我怕哪天网站太火，OSS资源刷爆账单！】

一是做梦，有那一天，你还在乎这点钱？

还是好好搬砖吧。哎，最近又……，算了不提了

想到手上还有两台轻量应用服务器，包月流量不小，带宽也还可以，现在就跑了几个应用和MySQL，Redis，ES等中间件，还可以搞

【等等，你不是前端吗，要这些东西干嘛】

我骨子里是后端

MinIO ​

MinIO is a high-performance, S3 compatible object store. It is built forlarge scale AI/ML, data lake and database workloads. It is software-definedand runs on any cloud or on-premises infrastructure. MinIO is dual-licensedunder open source GNU AGPL v3 and a commercial enterprise license.

【说的真好，嗯。。说的啥】

它说自己很牛逼

【？！】

就是自己能用来搭建对象存储服务，自己去看 MinIO 高性能分布式存储，私有云存储

安装 ​

当然，你可以裸机直接装，我选择 docker 的方式

查询下信息 ​

bash
docker search minio
# 我们选择第一个

创建数据目录 ​

bash
# 请相对于自己的目录
mkdir -p data/containers/minio/data

创建 docker-compose.yml ​

目录：data/containers/minio/docker-compose.yml

请相对于刚才自己创建的目录

yaml
services:
  minio:
    image:"minio/minio:latest"
    restart: "always"
    ports:
      - "9006:9000"
      - "9007:9001"
    volumes:
      - ./data:/data
    environment:
      - MINIO_ROOT_USER=<yourusername>
      - MINIO_ROOT_PASSWORD=<yourpassword>
    command: minio server /data --console-address ":9007"

端口 9006 用于访问

端口 9007 用于控制台

ps: 这里留了个小坑，看看有没有同学发现，评论区见

创建启动服务 ​

bash
docker compose up -d

查看服务状态和日志 ​

bash
docker compose ps
docker compose logs -f
bash
NAME                IMAGE                COMMAND                  SERVICE             CREATED             STATUS              PORTS
minio-minio-1       minio/minio:latest   "/usr/bin/docker-ent…"   minio               3 minutes ago       Up 3 minutes        0.0.0.0:9006->9000/tcp, 0.0.0.0:9007->9001/tcp
[root@VM-4-3-centos minio]# docker compose logs -f
minio-minio-1  | Formatting 1st pool, 1 set(s), 1 drives per set.
minio-minio-1  | WARNING: Host local has more than 0 drives of set. A host failure will result in data becoming unavailable.
minio-minio-1  | MinIO Object Storage Server
minio-minio-1  | Copyright: 2015-2024 MinIO, Inc.
minio-minio-1  | License: GNU AGPLv3 - https://www.gnu.org/licenses/agpl-3.0.html
minio-minio-1  | Version: RELEASE.2024-06-13T22-53-53Z (go1.22.4 linux/amd64)
minio-minio-1  |
minio-minio-1  | API: http://172.18.0.2:9000  http://127.0.0.1:9000
minio-minio-1  | WebUI: http://172.18.0.2:9007 http://127.0.0.1:9007
minio-minio-1  |
minio-minio-1  | Docs: https://min.io/docs/minio/linux/index.html
minio-minio-1  | Status:         1 Online, 0 Offline.
minio-minio-1  | STARTUP WARNINGS:
minio-minio-1  | - Detected Linux kernel version older than 4.0.0 release, there are some known potential performance problems with this kernel version. MinIO recommends a minimum of 4.x.x linux kernel version for best performance
minio-minio-1  | - The standard parity is set to 0. This can lead to data loss.

验证下服务 ​

这里我们直接把9006和9007端口暴露到公网，然后自己本地测试下

ps：验证后从防火墙上把这两个接口禁用掉，再用 nginx 反向代理过去

服务启动成功

创建下bucket，这里就叫blog-static，后续其他使用场景也可以用创建其他的 ​

bucket

设置下访问规则并测试下 ​

设置访问规则

测试图片

测试访问下 ​

测试图片

ps: 这里有个非常重要的点，就是我们一开始设置的 9007 端口是控制台，那么我们实际访问的端口其实是 9006，所以测试地址应该是

http://ip:9006/blog-static/vue3 响应式.jpeg

域名配置和 nginx 反向代理 ​

接下来就是讲MinIO的服务和控制台配置到自己域名上去

申请域名和 HTTPS 证书的步骤这里就忽略了，大家可以去查下资料

这里直接给出 nginx 的配置信息，如果需要对应安装部署步骤的话评论区或者私聊下我

nginx
server {
    listen  443 http2 ssl;
    server_name  static.miaodaddy.xyz;


    gzip on;
    gzip_buffers 32 4K;
    gzip_comp_level 6;
    gzip_min_length 100;
    gzip_types application/javascript text/css text/xml;
    gzip_disable "MSIE [1-6]\."; #配置禁用gzip条件，支持正则。此处表示ie6及以下不启用gzip（因为ie低版本不支持）
    gzip_vary on;

    access_log  /var/log/nginx/minio.access.log;

    ssl_certificate  /etc/nginx/ssl/static.miaodaddy.xyz_bundle.pem;
    ssl_certificate_key /etc/nginx/ssl/static.miaodaddy.xyz.key;

    location / {
      proxy_redirect off;
      proxy_set_header Host $host;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      proxy_set_header X-Forwarded-Proto $scheme;

      proxy_pass http://localhost:9006;
    }
}

【现在免费SSL证书有效期只有 90 天，nnd】

配置完后，就能愉快的配置PicGo和Typora了

测试域名和SSL配置后的效果

PicGo 配置 ​

这里首先要在Minio上申请下AK和SK，记得保存下

ak和sk

先在PicGo的插件里面安装MinIO的插件，然后我们先测试下PicGo的功能是否正常

【我承认你这个配置是一次性成功的 😄】

Typroa 配置 ​

最后一步就比较容易了

总结 ​

还是一段比较顺利的探索之旅

【狗屁，报错，查资料，你不知道你重试了多少次啊？🤭】

其实这里还有个小问题，就是每次上传后，返回的图片地址包含了域名加 443 的情况，这个留给大家思考下，是哪里出的问题

但是对于MinIO的探索还远没有结束，下一期我们可以看下MinIO更高阶的功能，比如权限配置，如果部署达到高可用的目的

其实真要部署高可用的话，需要更多的机器资源，到时候算下ROI的话，还不是直接买OSS或者COS呢，对吧，到那一天再说

但是我们可以继续挖掘下Minio的功能，比如哪天要迁移到OSS，我们如何进行，我们下期见

不如我们单开个系列就叫**前端玩转服务器**吧，还有更多更好玩的东西等待我们的学习和实践

Last updated: