如何将图像从本地计算机加载到JS对象，避免加载到服务器
我想将计算机中的图像文件直接加载到任何js对象，而不使用任何服务器端组件。 例如，我想从本地计算机中选择一张图片并将其显示在网页上。 有没有办法避免文件上传到服务器？
实际上我想编写一种多图像加载器，但在加载到服务器之前我想要旋转一些图像，创建一个xml文件，其中包含一些数据，如用户ID，图像文件名列表以及压缩所有图像和此xml然后将其发送到服务器。 我怎么能在客户端这样做？
HTML5有一种方法，但它要求用户将文件放入放置目标或使用框，否则会出现安全问题。
使用File API可以读取文件，具体而言，您可以使用FileReader.readAsDataURL方法将内容设置为data:图像标记的URL。
这是一个例子：
$('#f').on('change', function(ev) { var f = ev.target.files[0]; var fr = new FileReader(); fr.onload = function(ev2) { console.dir(ev2); $('#i').attr('src', ev2.target.result); }; fr.readAsDataURL(f); });
使用新的File API ，可以从本地磁盘访问内容。
您在页面上放置了传统的 upload字段，并处理onchange事件。
MDN有一个很好的写作，包含所有细节。
您的事件处理程序获取包含Files的FileList 。 从那里，您可以调用FileReader.readAsDataURL(File)来获取图像的内容，然后将该数据URL传递给来进行旋转。
您可以使用window.URL对象的createObjectURL方法，但这并没有太多的浏览器支持