现在的位置: 首页 > 综合 > 正文

html5之文件与图片拖放上传

2018年04月02日 ⁄ 综合 ⁄ 共 718字 ⁄ 字号 评论关闭

前一阵子听了前端的一个分享,其中介绍了HTML5中的一些新特性,特别感兴趣的是文件上传拖放上传:

今晚前端同事提起,刚查了下资料,有些小失望,不过功能真的很实用。

我的理解是:

    对于图片他们是编码成了data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEASABIAAD//gASeGlhb25laTIyNDgxMDYzN//bAEMAAwICAwICAwMDAwQDAwQFCAUFBAQFCgcHBggMCgwMCwoLCw0OE。。。类似于这样的格式,其实就是bas64编码,浏览器所谓支持的话就是能对这种格式的数据完整的解析后然后在浏览器上展现图片;文件也类似;

     另外对于编码除了base64而外,还有二进制等编码等,只是编码不同而已。

     对于采用的新的方式实现后,拖放的数据应该已经上传到服务器了,前端进度条的实现等(内存中)。而后端要获取数据的方式跟原来是一样的。

     HTML5这些功能的更新是使前端展现更丰富。

    至于如果实现看了下代码,稍微了解下,只是以前实现过ajax的一些细节,所以才有兴趣研究下此特性。因为对xmlhttprequest感兴趣。而本次更新在这方便优化很大。

    下面是两个HTML5在文件拖放与上传不错的文件,有兴趣的可以去研究下。在此也记录下:

入门中文博文

http://gandli.blog.163.com/blog/static/3084958420101023274347/

xmlhttprequest的API官网。

https://developer.mozilla.org/en/XMLHttpRequest#sendAsBinary%28%29

抱歉!评论已关闭.