文件上传下载类组件,使用的是OSS的SDK,用于处理文件图片上传及获取一些参数。
// 方法
/**
* 文件上传下载类,使用的是OSS的SDK
*/
declare class Upload {
constructor(bucket: string, projectName?: string, opts?: {
region: string;
accessKeyId: string;
accessKeySecret: string;
secure: boolean;
});
client: OSS;
Options: OSS.Options;
Host: string;
ProjectName: string;
getFileName(file: File): Promise<string>;
/**
* 简单的上传文件,小于100MB
* @param file 文件对象
* @param opts 参数
* @returns 文件结果对象
*/
upload(file: File, opts?: OSS.PutObjectOptions): Promise<{
uid: any;
key: any;
url: string;
downloadUrl: any;
}>;
/**
* 获取下载的url
* @param fileName 文件名称,兼容url
* @returns 下载url
*/
getDownloadUrl(fileName: string): any;
/**
* 缩放图片宽高,可以只指定宽度或者高度
* @param fileName 文件名
* @param w 宽度
* @param h 高度
* @returns
*/
resizeImage(fileName: string, w: string, h: string): any;
/**
* 返回图片的宽高
* @param file
* @returns
*/
getImageWidthHeight(file: File): Promise<unknown>;
}
export default Upload;
使用方法非常简单,基本上就是拿来即用
// 首先在package.json 中 加入 img_oss 的引入,然后 yarn / npm install
"@dm/img_oss": "^1.0.9",
// 然后在需要用到的地方 import
import IMGOSS from '@dm/img_oss';
// BUCKET 此处为oss地址
const IMGCLIENT = new IMGOSS(BUCKET);
// 我这里是在antd 的upload 基础上做的处理,用的是customRequest
我们项目中一般是基于Upload另外封一个上传和回显,此处只阐述覆盖默认行为后使用@dm/img_oss的部分。
<

介绍了一个基于OSS SDK的文件上传下载组件,支持图片的上传、获取URL及宽高处理等功能。提供了图片宽高限制校验的方法,确保图片符合特定尺寸要求。
最低0.47元/天 解锁文章
1405

被折叠的 条评论
为什么被折叠?



