besscroft / PicImpact

PicImpact 是一个摄影师专用的摄影作品展示网站,基于 Next.js 开发。今天又是想当二次元摄影高手的一天呢!
https://pic.besscroft.com
MIT License
611 stars 86 forks source link

Proposal: 支持 CDN #39

Closed cospotato closed 3 months ago

cospotato commented 3 months ago

Hi,感谢您的工作,我一直想找一个带完善 EXIF 展示的好看的画廊站,这个好棒!

功能描述

我使用的自建的 Minio 服务,但是 bucket 是 private 的,并且在公网我期望通过 CDN 来访问,也就是说我期望能有这样的功能:

用户故事:支持指定访问照片时的地址

  1. 我编辑 S3 存储库的配置,指定 OSS 地址为 https://oss.example.com
  2. 我编辑 S3 存储库的配置,指定访问地址为 https://static.example.com
  3. 我创建一个公网的 CDN,地址为 https://static.example.com 回源到 https://oss.example.com
  4. 我上传一张照片到 S3 存储库,相册为 test,服务通过 https://oss.example.com 上传文件到目标的 OSS,上传后的 OSS 路径为 https://oss.example.com/picimpact/test/somephoto.jpeg
  5. 我通过 Web 页面访问这张照片时的地址为 https://static.example.com/picimpact/test/somephoto.jpeg

用户故事:支持图片访问代理

这个主要用于通过 CDN 进行全站加速

  1. 我的 PicImpact 实例地址为 https://picimpact.example.com
  2. 我编辑 S3 存储库的配置,指定 OSS 地址为 https://oss.example.com
  3. 我编辑 S3 存储库的配置,勾选 使用访问代理
  4. 我上传一张照片到 S3 存储库,相册为 test,服务通过 https://oss.example.com 上传文件到目标的 OSS,上传后的 OSS 路径为 https://oss.example.com/picimpact/test/somephoto.jpeg
  5. 我通过 Web 页面访问这张照片时的地址为 https://picimpact.example.com/test/somephoto.jpeg
github-actions[bot] commented 3 months ago

非常感谢您提交了 issues,我们很高兴能够与您一起合作解决这个问题。我们将尽快进行审核,并会在 24 小时内回复您。在此期间,如有任何问题,请随时联系我们。再次感谢您的贡献!

besscroft commented 3 months ago

@cospotato 感谢您的建议,这个功能我会添加。就我使用经验而言,虽没法一套配置兼容所有支持 S3 的云存储,但可以先适配常见的。我会抽空加上这个功能!

besscroft commented 3 months ago

另外,支持图片访问代理 功能,我会考虑下。优先提供图片上传时的 CDN 配置功能。

hexgu commented 3 months ago

这个功能非常的好!

但是在实现支持指定访问照片时的地址的时候,能不能考虑支持分别设置缩略图和原图的地址

我目前的照片地址配置是原图走了OSS,但是缩略图额外走一层WebP Server Go将略缩图转换为 webp 格式进一步压缩,所以我得每个手动指定缩略图地址

当然,如果能够在创建缩略图就转换为webp的话最好了,不过我不太确定大家的需求

最后非常感谢您的项目,真的很好用

besscroft commented 3 months ago

@hexgu 感谢您的建议,我觉得可以直接将压缩后的格式从 image/jpeg 改为 image/webp 格式,毕竟小卡片上的预览图没有必要特别高清,尽可能在良好的观感下压缩尺寸才是合理的。

MDN 描述:WebP 支持通过基于 VP8 视频编解码器的预测编码进行有损压缩,以及通过替换重复数据进行无损压缩。有损 WebP 图像比视觉上压缩级别相似的 JPEG 图像平均小 25-35%。无损 WebP 图像通常比 PNG 格式的相同图像小 26%。