File文件API

由于网页可能存在各种有意的或无意的攻击,浏览器通常认为网络中的网页是不安全的。
即使在浏览器的渲染引擎被攻击的情况下,也不可能获取主机系统中的任何权限,这一思想称为浏览器的沙箱(sandbox)模型。
在HTML 5中,Web应用程序可以请求临时或永久的存储空间来访问客户端文件,操作相对便利。

在HTML 5规范中提供了File API接口,具体如下:
Blob对象表示原始的二进制数据;
File对象表示用户选择的一个文件;
FileList对象表示用户选择的文件列表;
FileReader对象用来将文件读取到内存中;
URL对象为Blob(或File)二进制数据提供一个可访问的URL地址,以便在Web页面中引用Blob类型的数据。
file文件应用



	
		
		File对象的使用
	
	
		选择文件:
		

文件名称:
文件大小:字符
文件类型:
修改时间:

File文件API_第1张图片

fileList



	
		
		FileList对象的使用
		
	
	
		选择文件
		    
		

item()方法遍历结果如下:


files属性遍历结果如下:


File文件API_第2张图片
FileReader接口用于将磁盘中的文件读入到内存中,能够使用二进制数据、文本、DataURL和ArrayBuffer等格式来读取文件。
FileReader接口提供的属性和方法如下:
属性readyState用于返回FileReader的当前状态;
属性result将根据FileReader.readAsXxx()方法来返回一个DOMString类型的Blob数据、ArrayBuffer数组或者空对象;
属性error用于返回FileReader读取数据时发生的DOMError错误;
readAsArrayBuffer()方法用于读取Blob数据并以返回一个ArrayBuffer对象;
readAsText()方法用于读取Blob数据并以返回一个文本类型的对象;
readAsDataURL()方法用于读取Blob对象或File对象中的内容;
abort()方法用于终止数据的读取并返回null。



	
		
		FileReader对象的使用
		
	
	
		


File文件API_第3张图片
URL接口用于创建Blob或File对象的URL引用地址;
URL形式如下:blob:http://127.0.0.1:8020/9aa84362-ed63-4af7-b3d6-53b8d0d13f66。
URL接口中提供了以下两个方法:
createObjectURL()方法是一个静态方法,用于为blob对象随机生成一个的URL引用地址;
revokeObjectURL()方法是一个静态方法,用于将createObjectURL()方法所创建的URL失效,无法继续使用。



	
		
		Blob URL
		
	
	
		


File文件API_第4张图片

Blob



	
		
		Blob对象的使用
	
	
		选择文件:
		

文件大小:字符
文件类型:

构造




	
		
		
	

	
		
	


切割




	
		
		
	

	
		
	


File文件API_第5张图片

你可能感兴趣的:(web前端)