S3ImageHosting纯前端、欣赏器可用、超轻量的基于对象存储的图床管理工具

[复制链接]
发表于 2025-11-6 01:28:06 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有账号?立即注册

×
S3ImageHosting

   纯前端、欣赏器可用、超轻量的基于对象存储的图床管理工具
  个人开发实属不易,以为有用大概是喜欢的话,不要忘记先来Github上点个Star让我知道这个项目有人用,更有动力维护,更多的Star也让该项目可以大概被更多人发现利用大概是到场开发,非常告急!!!
项目链接 Github - https://github.com/2061360308/S3ImageHosting
目次

特性
测试效果 ✅
利用方法
告诫 ⚠️
开发&贡献 ️
协议&授权
鸣谢
特性

      
  • 纯前端,欣赏器可用  
  • 超轻量  
  • 高扩展  
  • 功能全面  
  • 多种服务支持  
  • TypeScript 范例齐备  
  • 表明过细  
  • 完备测试用例  
  • 模块化计划
纯前端,欣赏器可用

纯前端语言编写,可直接在欣赏器中调用,无需后端支持,无需设置复杂服务器。
超轻量

只提供底子的接口包装,未压缩前体积仅 42.54KB,加载速率快,性能良好。
高扩展

区别于传统图床项目,该库仅是针对性地将对象储存包装为了可以方便利用的图床相干的实用接口,开发者可以根据须要自由扩展和定制功能,以满足特定的业务需求。用户也不必担心迁移平台时的复杂标题,同利用此项目的图床可以直接迁移,就算迁移其他图床也能方便的剖析本类图床产生的数据,包管数据不丢失
功能全面

近20 个方法,提供包罗上传图片、删除图片、天生图片在线链接、依据标签或相册筛选、根据创建时间检察图片等超多实勤奋能。
多种服务支持

基于对象储存构建,利用亚马逊 S3 标准接口,可兼容大部分主流平台,如:

      
  • 腾讯云 COS  
  • 阿里云 OSS  
  • 七牛云 Kodo  
  • 亚马逊 S3
TypeScript 范例齐备

提供完备的 TypeScript 范例界说,加强开发体验和代码可靠性,镌汰运行时错误。
表明过细

代码表明过细,便于明白和维护,资助开发者快速上手和二次开发。
完备测试用例

提供完备的测试用例,确保代码质量和稳固性,方便开发者举行单元测试和集成测试。
模块化计划

全部静态方法均独立编写,并在 index.ts 中同一导入和注册,便于阅读源码、修改和机动利用静态方法。
测试效果 ✅

   利用 vitest 编写测试,全部测试均在src/test目次下
  

   @测试用例 具体输出内容  利用方法

初始化方法示比方下
  1. export const settings: Settings = {
  2.    
  3.    
  4.   bucket: process.env.BUCKET as string, // 储存桶名称
  5.   endpoint: process.env.ENDPOINT as string, // 服务端点/服务地址/服务 URL
  6.   region: process.env.REGION as string, // 储存桶地区
  7.   accessKeyId: process.env.ACCESS_KEY_ID as string, // accessKeyId
  8.   secretAccessKey: process.env.SECRET_ACCESS_KEY as string, // secretAccessKey
  9. };
  10. const s3 = new S3ImageHosting(settings);
复制代码
可以参考各大厂商的阐明文档

      
  • 腾讯云 COS  
  • 阿里云 OSS  
  • 七牛云 Kodo  
  • 亚马逊 S3
以下给出S3ImageHosting的方法模子
  1. class S3ImageHosting extends S3ImageHostingMethods {
  2.    
  3.    
  4.   readonly version: string;
  5.   settings: Settings;
  6.   client: S3Client;
  7.   constructor(settings: Settings);
  8.   isExistImage: (key: string) => Promise<boolean>;
  9.   uploadImage: (
  10.     fileData: Blob | Buffer | Uint8Array,
  11.     fileType: _ImageType1,
  12.     create: Date,
  13.     update: Date,
  14.     album: string,
  15.     tags: string[]
  16.   ) =>
复制代码
回复

使用道具 举报

登录后关闭弹窗

登录参与点评抽奖  加入IT实名职场社区
去登录
快速回复 返回顶部 返回列表