如何将画布数据 uri 上传到亚马逊 s3 服务器

Posted 2023-02-22

【中文标题】如何将画布数据 uri 上传到亚马逊 s3 服务器

【英文标题】：How to upload canvas data uri to amazon s3 server

【发布时间】：2016-02-20 04:09:02

【问题描述】：

现在，我已经传递了画布数据 URI 字符串

(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAUAAAADwCAYAAABxLb1rAAAgAElEQVR..... )

到我的 hapi (NodeJS) 服务器。

我的问题是：

我接下来要如何“流式传输”/将这些数据上传到 Amazon S3 并在那里创建实际图像？

【问题讨论】：

所以真正的问题是，你如何从 nodejs 上传到亚马逊 S3。

您需要从这个base64图像创建一个流并将该流上传到S3

如果您搜索 SO 时已经找到 ***.com/questions/7511321/… 和 ***.com/questions/5867534/… ？让我猜你甚至没有搜索。

【参考方案1】：

将您的数据 URI 存储在一个变量中。 创建将数据 URI（64 位编码字符串）解码为字符串的函数（这里我创建了 dataURItoBlob() 函数），解码后返回字符串

将该字符串传递给 S3 上传函数的 body

var myDataUri = "data:application/pdf;base64,JVBERi0xLjMKMyAwIG9iago8PC9UeXBlIC9QYW..."

var myFile=dataURItoBlob(myDataUri);

function dataURItoBlob(dataURI) 
   console.log('1: ',dataURI);
   var binary = atob(dataURI.split(',')[1]);
   var array = [];
   console.log('2: ',binary.length);
   for (var i = 0; i < binary.length; i++) 
      array.push(binary.charCodeAt(i));
   
  return new Blob([new Uint8Array(array)], 
  type: 'application/pdf'
  );


 if (myFile)) 
   results.innerhtml = '';
   var params = 
     Key: new Date().getTime() + '.pdf',
     ContentType: 'application/pdf',
     Body: myFile
   ;

  bucket.upload(params, function(err, data) 
    results.innerHTML = err ? 'ERROR!' : 'UPLOADED.: ' + file;
  );
  else 
 results.innerHTML = 'Nothing to upload.';

【参考方案2】：

在发送对象到 s3 之前，必须将 base64 转换为缓冲区，发送之后，例如：

var buf = new Buffer(b64string, 'base64');
s3.putObject(/*some  params*/, Body: buf, function(err, data) 
  if (err) console.log(err, err.stack); // an error occurred
  else     console.log(data);           // successful response
);

在此之后，您将数据发送到 s3，您将无需解码即可打开图像。

祝你好运！