非常小的成本实现一个图床（远远不止）

[int64ago]

可以直接先体验 https://302.at/

手机也可以扫码体验（用浏览器打开）：

下面就啰嗦下介绍下

应该很多人都跟我一样有图床的需求，我几年前其实就做了，实现也很简单，就是找个对象存储服务商（比如七牛、阿里云 OSS 等）通过 SDK 实现，但是一直很别扭。周末重新梳理了下，我个人对此类需求有以下诉求：

• 好用，好看，在 PC 和手机上体验都要好
• 可控，依赖可靠服务商
• 金钱成本少，除了对象存储这个钱不得不花，其它尽量不花钱
• 人力成本少，尽可能使用已有能力，服务无状态，可随意换机器或横向扩展

然后，周末我就把上面的需求都实现了，并且还扩展了很多其它实用的功能

特性

• 🙌 Image/Video/File uploading （图片 /视频 /文件上传，CDN 支持）
• 🛣 Image placeholder （图片占位符）
• 🤳 QR Code generator （二维码生成）
• 🙈 URL shortener （短链接）
• 🦅 Responsive （响应式设计）
• 🐲 PWA support （ PWA 支持）
• ...

技术栈及依赖

• Next.js - SSR && PWA
• Ant Design v4 - UI Components
• Auth0 - Authentication
• LeanCloud - Data Storage
• Aliyun OSS - File Storage
• Docker + Caddy - Serving
• GitHub Actions - CI/CD
• PLACEHOLDER.COM - Placeholder(Proxy)
• Google Charts - QR Code(Proxy)
• ...

一些预览图

有兴趣的话代码在 GitHub，可以 fork 过去自己改改就能部署，绝大多数配置我都抽离成环境变量了，当然直接用也可以，不过最好登录下，非登录态会有些限制

[iiduce]

没看懂，文件究竟存储到什么地方了？

[int64ago]

@iiduce 文件在阿里云 OSS，当然换其他也很简单

数据储存在 LeanCloud，主要是云数据库太贵，自己 VPS 搭的感觉也不靠谱

[int64ago]

@iiduce 为了横向扩展，基本上应用都是用的外部服务，所以机器基本就只有纯计算逻辑，我对这点诉求很高，因为要应对随时可能被封的主机

[Cbdy]

从一个设计师的角度，Logo 可以再设计一下，页面字号可以适当调整一下（感觉文字和按钮不协调字号）

[int64ago]

@Cbdy 🤓 求具体点的指导

[lhx2008]

项目是不错的，阿里云要注意账单

[sofarx]

你图床上传的图在我这里都是显示问号

[fengbjhqs]

如果只是图库，感觉可以不需要数据库， 可以自建 cdn，文件放本地

[7gugu]

噢，不错哦！会长久运营吗？

[luckyrayyy]

常见的图库都是放到第三方的，就没有能放到本地的么...

[int64ago]

@7gugu #9 我自己要用的东西肯定会长久，而且代码里有黑名单机制，如果有滥用的人会直接点对点拉黑

而且针对访问频率我也做了限制


当然，以上只要是正常使用都不会感知

[int64ago]

@luckyrayyy #10 放本地：

- 不便于迁移
- 可靠性不好保证（除非自己做三备份）
- 磁盘性能不行（当然 SSD 好点）
- 没法使用到一些高级特性（比如三方都会支持图片裁剪压缩等）

[chenxiaoyan]

测试了一下，上传挺快的，可老哥，怎么删掉我上传的图片？？😂

[int64ago]

@chenxiaoyan 登录状态下是可以删的，匿名为了不干扰别人测试，禁了删除

[iiduce]

一直想做一个自用放照片的网盘，觉着这个界面功能挺合适。

我有空闲的阿里云服务器 ECS，求教把文件和数据存储都放在阿里云上，容易改么？ 主要需做哪些工作。

希望能得到您的指教，谢谢！ @int64ago

[opengps]

目前看来并不是低成本，oss 的流量费问题你没有提到，这个往往是最贵的支出

[int64ago]

@opengps 我提到了

金钱成本少，除了对象存储这个钱不得不花，其它尽量不花钱

这个没办法，不得花这个钱

[int64ago]

@iiduce 部署这块我没多说，因为每个人部署方式可能都不一样

我可以说下我的：

- GitHub Actions 自动 Docker build && push

- 搞台 VPS，装好 Docker，然后便排好应用和 Caddy 即可

[ryV60s]

一打开就有黄图 (/ □ \)

[int64ago]

@ryV60s 不要慌，我接了鉴黄服务，我看到黄图确实貌似已经被自动冻结了 :-)

[miao666]

楼主，图床的精髓是白嫖其他大厂的资源啊，你用到自己的 OSS 就已经输了。
哪天你的帖子火了，流量费用好几百你不肉疼吗😂

[int64ago]

@miao666 不要慌，我都有考虑

资源是小事，免费资源多得很，主要是易用度很重要，再说不觉得我这个很快么 🤓

最后，放心，火不起来的 😄

[d5]

很酷，star 一下！

另外，图床的精髓是白嫖其他大厂的资源啊，这个还是十分有道理 hhh

[cmdOptionKana]

刚刚上传了个视频，上传速度奇快无比！

[cmdOptionKana]

@int64ago 鉴黄服务贵不贵？

[xinxing260]

可以都放自己的 nas 上

[int64ago]

@cmdOptionKana 还好，基本可以忽略

[xinxing260]

@d5 你说的很对，图床的精髓是白嫖

[ostrichb]

@int64ago 刚刚看到有敏感资源，建议筛查一下

[qk1683518]

我日 打开一看都是黄图

[Ev1s]

刚看了一下 你这没有内容筛查的吗，怎么什么奇奇怪怪的东西都有 -_-||

[qiguai2017]

第一眼看到黄图了

[6IbA2bj5ip3tK49j]

这个鉴黄意思就是把非黄色图片全部过滤掉吗？

[NeinChn]

看了楼上几楼,突然觉得现在图床最大的开销在机器学习判断图片是否合规上

[xxx027]

网站打不开:-(
ERR_CONNECTION_REFUSED

[duoduo1x]

无法访问此网站 302.at 拒绝了我们的连接请求。

[int64ago]

@ostrichb
@qk1683518
@Ev1s
@qiguai2017
@xgfan
@NeinChn
@xxx027
@duoduo1x

刚刚停服清理违规内容，并且上了新规则，必须登录才能上传

[ShundL]

一直好奇想你这么个服务的 oss 每月开销多少。。。

[int64ago]

@ShundL 看情况，目前块把钱

[HereApp]

Mac 上可以做成 Here 插件试试
t/643399

[heiheidewo]

用爱发电吧，最后发现只有自己再用

[dmjob2015222]

antd

[azh7138m]

cdn.int64ago.org
无法在海外访问

[int64ago]

@azh7138m 感谢提醒，我就说我搭梯子看不到图片呢，CDN 回源参数设置问题，已修改

[marcomarco]

千万别发到隔壁 hostloc，不然你现在要准备卖房了

[bigbigeggs]

试了试，速度够快。但小心后续的流量，免费流量用完了就得续费了。

[bigbigeggs]

再次感谢分享，希望别哪一天服务突然挂了

[wpblank]

刚试了下，速度还不错。Copy MD 出来的文字 ![] 中能加上图片名字就更好了

[registered]

表示手中有各种免费好用的图床。你这个产品定位不是图床吧，感觉是私人多媒体中心。

[int64ago]

@registered 我也不知道叫什么，所以标题后面有个 远远不止

[int64ago]

@wpblank #48 已加

[chinesestudio]

@int64ago 有了 vps 反代就好了 费那么多事
试试我的搜爱图床 https://i.sofever.com 图都存在本地 freenas 上

[no1xsyzy]

@d5 想起那个 google 相册套 cloudflare 的……

[d5]

@no1xsyzy 鬼才，这也可以

[no1xsyzy]

@d5 看了下准确地说是 Google Drive 套 Cloudflare workers，前端抄的 sm.ms
某个人站上发布的，看了下，该站用户们用的图床好多换了这个的样子…… 我看到那个帖子没太在意结果发现后来好多用的图床都是那个域名…… (bgm38)

[csdreamdong]

qr code 其实可以 js 来生成