开发项目的时候，用到文件上传的功能很常见，包括单文件上传和多文件上传，上传各种类型的文件。在vue里面要实现多文件上传功能，还是很方便的。

平常业务需求：上传图片、Excel等，毕竟几M的大小可以很快就上传到服务器。针对于上传视频等大文件几百M或者几G的大小，就需要等待比较长的时间。

不管怎样简单的需求，在量级达到一定层次时，都会变得异常复杂，文件上传简单，文件变大就复杂，上传大文件时，以下几个变量会影响我们的用户体验

其实预览功能实现上都差不多，所以今天我们都来实现一下咯。一般来说上传常见的操作就三种，单击、拖拽、粘贴。下面我们分别来说一下。

最近做公司业务, 上传图片出问题了~首先是要求前端传递的图片名称不能是中文 ?问题又来了, new File在ie下报错,也就是说在ie下调用上传图片功能是无效的

给<input>标签的父级设置一个‘+’背景图，把<input type=file>的宽高设置得跟父级一样，且完全透明，这样点击的时候看似是点击的‘+’的节点，其实点击的是<input>节点。

使用react-quill富文本编辑器，里面处理图片是默认转成base64，提交到后台的时候文件太大，因此这里改写处理image的逻辑，改成上传到服务器。具体代码如下：

Jquery+AJAX上传文件，无刷新上传并重命名文件、获取原始文件名;获取文件后缀名;设置新文件名;允许上传的图片后缀;记得自己手动建立一个upload的文件夹用于存放上传的文件。

将图片发给后端 ajax:1.前端获取图片信息 文件域；2.将文件信息 存到formdata；3.调用后端写的api接口发送数据;b.接受返回的数据;前端页面显示图片

最近项目开发中涉及到文件上传功能，使用的是七牛的服务。查看七牛文档发现文件上传格式为blob，而本地添加上传文件时获取到的是file格式，因此需要将file转换为blob，具体转换方法如下：

在平时项目开发中，我们经常会对文件做一些上传操作，不仅仅要实现基本需求，也要兼顾用户体验，根据自己在工作中遇到的问题谈谈对图片上传的预览以及上传进度的优化。

通过设置nginx的client_max_body_size解决nginx+php上传大文件的问题： 用nginx来做webserver的时，上传大文件时需要特别注意client_max_body_size这个参数,否则会中断在nginx的请求中,在php中是无法记录到访问的.

在做上传文件的时候，大家会引入input标签。但在实现的过程中，在上传一个文件后，第二次上传同一个文件时会无法触发上传的代码，问题其实这样解决。

在使用file上传文件的时候，想到了图片预览的功能，然后查询了一些资料，一种是需要后端配合，将数据变成base64或者buff等数据传给后端然后调取接口进行显示，但是这种需要后端的配合和网络请求，感觉不如在纯前端操作方便的多

谷歌浏览器升级到chrome52.0.2743.80版本以上，会出现点击上传文件选择框会延迟几秒才会显示 反应很慢的情况。方案一：修改accept参数；方案二：浏览器修改设置