Fit项目图片上传和云存储的调通

项目中关于动作的说明需要相应的配图,这样可以更直观的说明动作要点。本篇主要为项目中动作的新增和编辑做准备,确定适合场景的上传操作逻辑以及图片的存储和加载的方法。

一 上传方案

a) 本来所用的模板中是有一款挺好的上传控件的,支持多选、拖拽、并行上传。

 

但探索了半天后才意识到这个并不适合当前的场景。不管是动作的新增还是编辑,上传图片后最好能即时地看到所添加的图片。这个控件无疑带来了功能上的冗余。

b) 最后采用了基于html file类型的输入框做成的按钮。

 

查看代码,可以发现这种按钮是在label中包含了一个input,而且input属性为hide。

 

 

c) input放在表单中,一般需要点击提交按钮才能上传,但对项目来说,这个提交按钮是多余的,改成选中图片后自动上传。需要注册图片选择按钮的change事件,并在事件中自动提交表单。

 

 

d) 上传表单提交到服务器后,读取文件并做后续的处理,可多选上传。SaveImgInCloud是与保存到第三方存储服务相关的方法。

 


 

二 云存储

a) 现在使用的云存储要先创建存储空间,并设置空间的访问权限,为了方便上传后的读取操作,设置为公开空间,后面再想别的办法增加访问保护。

 

然后,根据开发者文档操作,这个虽然之前已经用过了,但仍然遇到不少麻烦。

 

 

b) 密钥测试时临时保存在常量中。第一次试验时上传失败,是因为没有设置区域,最后设置为自动识别区域Config.AutoZone()。

 

c) 另外还有同名文件覆盖的问题,按照文档要设置putPolicy.Scope = bucket + ":" + saveKey,否则会保留第一次上传的。

 

d) 文档提供了简单上传、字节上传、流式上传几种方式,本次使用流式上传。将file.InputStream作为上传对象即可。

 

原文地址:https://www.cnblogs.com/zhixin9001/p/7020395.html