HTML5技术

文件各种上传,离不开的表单 - 农码一生(4)

字号+ 作者:H5之家 来源:H5之家 2017-07-25 12:00 我要评论( )

到这里你以为就结束了吗?错,还有好多情况没有考虑到。如果多个用户上传的文件名字一样会怎样?如何实现断点续传?还没实现选择多个文件?不过,这里不打算继续贴代码了(再贴下去,代码量越来越多了),自己也来

到这里你以为就结束了吗?错,还有好多情况没有考虑到。如果多个用户上传的文件名字一样会怎样?如何实现断点续传?还没实现选择多个文件?不过,这里不打算继续贴代码了(再贴下去,代码量越来越多了),自己也来练习练习吧。
提供一个思路,上传前先往数据库插入一条数据。数据包含文件要存的路径、文件名(用GUID命名,防止同名文件冲突)、文件MD5(用来识别下次续传和秒传)、临时文件块存放路径、文件是否完整上传成功等信息。
然后如果我们断网后再传,首先获取文件MD5值,看数据库里面有没上传完成的文件,如果有就实现秒传。如果没有,看是不是有上传了部分的。如果有接着传,如果没有则重新传一个新的文件。

总结

之前我一直很疑惑,为什么上传文件一定要用form包起来,现在算是大概明白了。
最开始在javascript还不流行时,我们就可以直接使用submit按钮提交表单数据了。表单里面可以包含文字和文件。然后随着js和ajax的流行,可以利用ajax直接异步提交部分表单数据。这里开始我就纠结了,为什么ajax可以提交自己组装的数据。那为什么不能直接提交文件呢。这里我错了,ajax提交的并不是随意的数据,最后还是组装成了表单格式(因为后台技术对表单格式数据的支持比较普及)。但是现有的技术还不能通过js组装一个文件格式的表单数据。直到H5中的FormData出现,让前端js组装一个包含文件的表单格式数据成为了可能。所以说表单只是为了满足和后台“约定”的数据格式而已。

相关推荐

  • demo

  • https://github.com/zhaopeiym/BlogDemoCode/tree/master/上传下载
  • posted @

     

    1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

    相关文章
    • html5图片上传时IOS和Android均显示摄像头拍照和图片选择 - 出岫无心

      html5图片上传时IOS和Android均显示摄像头拍照和图片选择 - 出岫无心

      2017-07-10 10:00

    • Vue.js 基础指令实例讲解(各种数据绑定、表单渲染大总结)——新手入门、高手进阶 - Mr.聂

      Vue.js 基础指令实例讲解(各种数据绑定、表单渲染大总结)——新手

      2017-07-03 11:00

    • HTML5 进阶系列:文件上传下载 - _林鑫

      HTML5 进阶系列:文件上传下载 - _林鑫

      2017-07-03 10:03

    • 实现excel导入导出功能,excel导入数据到页面中,页面数据导出生成excel文件 - 还是盼盼好

      实现excel导入导出功能,excel导入数据到页面中,页面数据导出生成ex

      2017-07-02 13:00

    网友点评
    "