如何在手机上下载图像上传到我的服务器？

Question

我正在使用phonegap / cordova编写应用程序。在应用程序中，用户拥有个人资料，他们可以选择Facebook图像以包含他们的个人资料。

当他们为个人资料选择图片时，我想将这些特定图片上传到我自己的服务器。

我做了一些研究，并且能够编写一些下载图像的代码，但在我编写代码之前我还没有在移动设备上测试它。

我使用XML HTTP请求将图像下载为blob。但是，在移动设备上测试时，我收到了未设置blob.size参数的错误。

我在浏览器中检查过确实存在blob.size参数。在移动设备中，blob.size参数未定义。这让我相信手机上的webkit不支持blob，因此不能将图像作为blob下载。

我真的有两个问题：

1）我的评估是否正确，因为webkit不支持blob而没有下载blob？

2）如果1为真，那么在cordova中下载图像然后将其上传到我自己的服务器的正确方法是什么？或者，有什么方法可以调整我的代码，以便它可以在移动设备上运行？此外，我应该注意，由于文件已经下载到我的手机，有没有办法简单地在本地存储中访问它们而不是再次下载它们然后将该文件上传到我的服务器？

我目前以blob形式下载的代码如下：

function xhrPromise(url){
    var xhr = new XMLHttpRequest();
      xhr.open('GET', url, true);
      xhr.responseType = 'blob';
      xhr.onload = function(e) {
        if (this.status == 200) {
        var myBlob = this.response;
        return myBlob;
        }
      };
    xhr.send(); 
  }

根据进一步的研究，我想知道解决方案是否使用cordova文件传输插件？

任何建议都将不胜感激。

Answer 1

1）Webkit通过HTML File API支持blob。阅读：Exploring the FileSystem APIs

2）我会试着指出你正确的方向。我会做什么，如果我想下载图像然后重新上传到另一台服务器。

• 使用Cordova's FileTransfer Plugin下载图片并将其写入SD卡（Android）或App的文档文件夹（iOS）中的临时位置。

• 如果图片小于2MB，请使用简单的HTML标记链接到下载的图片，使用CDVFILE协议<img src="cdvfile://localhost/persistent/temp/image.jpg" />（适用于Android），然后使用AJAX通过编码将其发布到您的服务器将图像转换为base64。阅读：How to convert image into base64 string using javascript。

• 如果图片超过2MB，请使用Cordova's FileTransfer Plugin进行上传。

使用Cordova的FileTransfer插件时，您会遇到HTML文件API，我强烈建议您将此链接作为参考。阅读：Exploring the FileSystem APIs

我更喜欢使用base64编码的原因是因为1）我不喜欢依赖Cordova插件，他们曾经是超级越野车。 2）您可以将base64字符串保存到MySQL中（但超过2MB的任何内容都会影响您的服务器和设备编码）。