前言
如今,互联网中的大部分应用都需要上传文件功能,例如图片、视频、文档等。因此,云存储服务也应运而生,其中七牛云是一家值得推荐的云存储服务商。七牛云提供了丰富的 API 和 SDK,让开发者能够快速使用云存储服务。
本文将介绍一个 npm 包 —— egg-qiniu-sdk,它是 Egg.js 框架中使用七牛云服务的封装包,可以方便地将七牛云作为 Egg.js 项目的上传文件服务。
安装和配置
为了使用 egg-qiniu-sdk,我们需要先安装它。使用以下命令安装:
npm install egg-qiniu-sdk
安装完成后,我们需要在 Egg.js 中进行配置。
在 config 文件夹下新建 config.default.js 文件。在其中加入如下代码:
-- -------------------- ---- ------- ------------- - - ---------- ----- ----- ---------- ----- -------- ------- ----- -------- -- ---- ----- ----- ------ ------- ----- -------- --------- ----- ---------- -- ----- --- ---- ---------- ---- -- - -- ------ ------ ------ -------------------------------- - --
accessKey:在七牛云控制台中申请的 AccessKey;
secretKey:在七牛云控制台中申请的 SecretKey;
bucket:用来存储文件的空间名称;
zone:该参数可以不填。默认为 Zone_z0,也就是华东地区;
origin:该参数可以不填。默认为
http://${bucket}.qiniudn.com/
;pathname:该参数可以不填。默认为
/upload/
;key:可选参数,为自定义上传 key。默认为随机字符串。
使用方法
封装 Service
在应用中,我们通常会将对七牛云的请求封装成 Service,以便在 Controller 中使用。
在 app/service 目录下新建文件 qiniu.js,其中加入如下代码:
-- -------------------- ---- ------- ----- ------- - ----------------------- ----- ----- - ------------------------- ----- ------------ ------- ------- - ----- ---------- - ----- - ---- --- - - ----- ----- --- - --- ------------------------------------------------- ---------------------------- ----- ------- - - ------ ----------------------- -- ----- --------- - --- ---------------------------- ----- ----- - --------------------------- ------ ------ - - -------------- - -------------
异步上传文件
在上传文件时,我们可以使用七牛云提供的异步上传方式,从而在上传完文件后,七牛云会异步地执行我们提供的 callback 函数。
在 app/controller 目录下新建文件 upload.js,其中加入如下代码:
-- -------------------- ---- ------- ----- ---------- - -------------------------- ----- ---------------- ------- ---------- - ----- -------- - ----- - --- - - ----- ----- ----- - ---------------- ----- ---- - ----- -------- ----- ------------ - --- ------------------------------ --------------------- ----- -------- - --- ------------------------- ----- ------ - ------------------------- --- ------- - ----- ----- ------ - ----- -------- -- ----- - ----- -------- - ----- ------------------------------- - -------- ------- ----- ---- --- ------- - ---------------- ----- ----- ----- - ----- ----------------------------- ----- ------ - ----- --- ----------------- ------- -- - --------------------------- -------- -------------- --------- --------- -------- --------- -------- - - -- --------- - ---------------- - -- -------------------- -- ---- - ------------------ - ---- - ----------------- - --- --- - ------ - ---- ------- -- - - -------------- - -----------------
在 egg 中,我们可以使用
multipart()
方法获取上传的文件。由于异步上传文件时,需要等待文件流全部传输到服务器才能上传到七牛云,因此需要循环处理。在处理每个 part 时,我们可以通过调用
await ctx.helper.saveUploadFile(part, { extname: '.png', sha1: true })
方法来保存文件至本地,并获取类似如下的 fileInfo:
{ fieldName: 'file', originalFilename: 'test.png', tmpFilePath: '/tmp/test.png_5c0e6d8c6f0897eca140b465', hash: '3cba3e65a7c0f61aa3eb188ab3a606d2e9ac471b' }
同时,在该方法中可以调用
ctx.app.config.qiniu.key
来获取自定义上传 key 的方法。我们可以自行实现该方法,以便将上传 key 与当前用户关联。默认的实现方式为返回一个随机字符串。最后,我们通过调用
formUploader.putFile()
方法来上传文件到七牛云。该接口的返回值为上传文件的 key。
在模板中使用上传文件链接
在模板中,我们可以使用以下方法来生成文件的链接:
-- -------------------- ---- ------- ----- - --- - - ----- ----- ------ - ---------------------------- ----- ------ - --------------------------- -- -------------------------------- ----- -------- - ------------------------------ ----- ------- - ------ ------ ---------------------------------
其中,上述代码中,fileKey 即为我们上传时返回的 key。
总结
本文介绍了 Egg.js 中使用七牛云上传文件的 npm 包 —— egg-qiniu-sdk,并且将它封装到 Service 中,以便在 Controller 中进行调用。
同时,本文还给出了如何使用异步上传文件的示例代码,以及在模板中使用上传文件链接的方法。它们不仅在 Egg.js 中使用,也对于其他框架实现上传文件功能时有一定的参考价值。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60059eb381e8991b448ed4c0