如何用在浏览器端预览本地文件?
由于浏览器安全策略的限制,javascript程序不能自由地访问本地资源,这是对用户信息安全来说,是一项不得不遵守的准则。假如网络上的javascript程序可以自如地访问用户主机的本地资源,那么浏览器用户将毫无安全可言。尽管有这个安全限制,但是在得到用户允许的情况下,浏览器还是可以访问本地资源的。
获得用户允许的方法就是通过标签来让用户手动选择文件,这一过程就是用户授予访问权限的过程。然后 使用获得File 对象通过URL.createObjectURL(file)转换为文件url,就可以传递给类似y于img,video,audio等标签使用了。我将本地文件转换为url 的功能封装成了一个类。
使用方法:
文件选择框,并且监听文件选择事件。
localFileUrl.getUrl(function(urls){
urls.forEach(function(item,array){
$("body").append("
"+index+"----"+item.url+"
")
})
})
使用jQuery 的promise对象改写
这种方式的好处是可以使用链式写法,并且可以绑定多个done事件处理函数,执行顺序按照绑定顺序。
使用方式
"+index+"----"+item.url+"
")
})
}).done(function(){
console.log("完成");
}).done(function(){
alert("已经读取了本地文件路径");
})