图片上传（二进制文件流）

业务需求：

• 文件上传在项目开发过程中是必不可少的一项功能。目前大多数文件上传都是采用文件流的形式进行上传。随着技术的进步，云服务技术的产生，现在上传文件相比原来更迅速、更方便，对上传文件的管理较之前来说方便了许多；
• 为兼顾原有的项目，上传文件没有采用现在使用比较多的阿里云oss文件直传，而是采用的后台辅助存储上传的形式来进行文件的存储。相对来说，文件上传比较慢，等待时间有点长。获取文件不像oss直传那样返回一个绝对的地址链接，而是返回的一个文件的key，通过指定的参数拼接来换取图片地址；
• 此次简称为‘文件流上传’，前期开发的时候出现了一些错误，现将原有的文件流上传文件的具体实现步骤做相应分析处理，以便日后开发过程中使用。

效果图：

• 注：图片上传成功后，会在右侧灰色图片区域内进行展示。

布局代码一：

• 基于【 Vue 】
• 采用elementUI的el-input标签与input文件上传标签相结合的方式；
• wtLoading为UI框架的el-button按钮loading加载状态。

样式代码：

// 上传按钮样式布局
.uploadBtn {
   
		display: block;
		height: 100%;
		width: 100%;
		position: relative;
		overflow: hidden;
	}