技术浅陋,不敢班门弄斧,抛砖引玉,浅谈则止。
js对象
1,Blob(binary large object)
一个 Blob对象表示一个不可变的, 原始数据的类似文件对象。
var blob = new Blob( ['test'], {type:'text/plain'} )
2,URL
URL 接口是一个包含若干静态方法的对象,用来创建 URLs。
var url = new URL('/url','http://zengxiaoluan.com')
URL.createObjectURL()
返回一个DOMString ,包含一个唯一的blob链接(该链接协议为以blob:,后跟唯一标识浏览器中的对象的掩码)
var blob = new Blob( ['test'], {type:'text/plain'} ) var url = URL.createObjectURL( blob ) console.log(url) // blob:http://zengxiaoluan.com/9d744e15-a598-4dc6-8ecb-e1166bdb5d55
3,FileReader
FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File
或 Blob
对象指定要读取的文件或数据。
var fr = new FileReader() var blob = new Blob(['hello world']) fr.onload = function( event ){ console.log( event.target.result ) } fr.readAsText( blob ) // hello world
readAsDataURL
开始读取指定的Blob
对象或File
对象中的内容. 当读取操作完成时,readyState
属性的值会成为DONE
,如果设置了onloadend事件处理程序,则调用之
.同时,result
属性中将包含一个data:
URL格式的字符串以表示所读取文件的内容.
4,Form Data
XMLHttpRequest Level 2添加了一个新的接口FormData
.利用FormData对象
,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的send()
方法来异步的提交这个”表单”.比起普通的ajax,使用FormData
的最大优点就是我们可以异步上传一个二进制文件.
Form Data .append
FormData
接口的append()
方法 会添加一个新值到 FormData
对象内的一个已存在的键中,如果键不存在则会添加该键。
var fd = new FormData(); fd.append("image", blob, "image.png"); var xhr = new XMLHttpRequest(); xhr.open('POST', '/server', true); xhr.send(fd);
TALK IS CHEAP,SHOW YOU THE CODE:DEMOS
One more thing
-
Uint8
Array -
ArrayBuffer
-
Array
Buffer View -
File
-
······
YET ANOTHER ONE MORE THING
参考链接
http://blog.csdn.net/cuixiping/article/details/45932793
https://developer.mozilla.org/zh-CN/docs/Web/API/FormData/FormData