【问题标题】:Uploading base64 encoded Image to Amazon S3 via Node.js通过 Node.js 将 base64 编码的图像上传到 Amazon S3
【发布时间】:2011-11-22 14:29:05
【问题描述】:

昨天我做了一个深夜编码会议并创建了一个小型 node.js/JS(实际上是 CoffeeScript,但 CoffeeScript 只是 JavaScript,所以可以说是 JS)应用程序。

目标是什么:

  1. 客户端(通过 socket.io)向服务器发送一个画布 datauri (png)
  2. 服务器上传图片到amazon s3

第 1 步完成。

服务器现在有一个字符串 a la

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACt...

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

knox https://github.com/LearnBoost/knox 似乎是一个很棒的库,可以将一些东西放入 S3,但我缺少的是 base64-encoded-image-string 和实际上传操作之间的粘合剂?? p>

欢迎任何想法、建议和反馈。

【问题讨论】:

标签: javascript node.js amazon-s3 coffeescript


【解决方案1】:

对于仍在为这个问题苦苦挣扎的人。这是我在原生 aws-sdk 中使用的方法:

var AWS = require('aws-sdk');
AWS.config.loadFromPath('./s3_config.json');
var s3Bucket = new AWS.S3( { params: {Bucket: 'myBucket'} } );

在你的路由方法里面(ContentType 应该设置为图片文件的内容类型):

  buf = Buffer.from(req.body.imageBinary.replace(/^data:image\/\w+;base64,/, ""),'base64')
  var data = {
    Key: req.body.userId, 
    Body: buf,
    ContentEncoding: 'base64',
    ContentType: 'image/jpeg'
  };
  s3Bucket.putObject(data, function(err, data){
      if (err) { 
        console.log(err);
        console.log('Error uploading data: ', data); 
      } else {
        console.log('successfully uploaded the image!');
      }
  });

s3_config.json 文件:

{
  "accessKeyId":"xxxxxxxxxxxxxxxx",
  "secretAccessKey":"xxxxxxxxxxxxxx",
  "region":"us-east-1"
}

【讨论】:

  • [MissingRequiredParameter: 参数中缺少必需的键'Key']
  • Key: req.body.userId 我在 post 数据中使用 userId 作为键...很久以前...但是您可以将任何字符串声明为键。为确保已存在的文件不会被覆盖,请保持密钥唯一。
  • @Marklar 位置路径基本上是关键 - 例如如果您的存储桶名称为 - bucketone 且键名称为 xyz.png,则文件路径将为 bucketone.s3.amazonaws.com/xyz.png
  • @Divyanshu 感谢您的出色回答!这对我帮助很大。但是,我认为ContentEncoding: 'base64' 不正确,因为new Buffer(..., 'base64') 将base64 编码的字符串解码为其二进制表示。
  • 对我有用,非常感谢
【解决方案2】:

好的,这就是答案how to save canvas data to file

在我的代码中基本上是这样的

buf = new Buffer(data.dataurl.replace(/^data:image\/\w+;base64,/, ""),'base64')


req = knoxClient.put('/images/'+filename, {
             'Content-Length': buf.length,
             'Content-Type':'image/png'
  })

req.on('response', (res) ->
  if res.statusCode is 200
      console.log('saved to %s', req.url)
      socket.emit('upload success', imgurl: req.url)
  else
      console.log('error %d', req.statusCode)
  )

req.end(buf)

【讨论】:

  • 缓冲区对象会抛出错误“缓冲区未定义”你能给我解决方案吗?
  • 我也遇到了同样的错误。你有没有解决方案
  • @NaveenG 这是一个节点示例,也许你使用的是纯 JS?
【解决方案3】:

这是我看到的一篇文章的代码,贴在下面:

const imageUpload = async (base64) => {

  const AWS = require('aws-sdk');

  const { ACCESS_KEY_ID, SECRET_ACCESS_KEY, AWS_REGION, S3_BUCKET } = process.env;

  AWS.config.setPromisesDependency(require('bluebird'));
  AWS.config.update({ accessKeyId: ACCESS_KEY_ID, secretAccessKey: SECRET_ACCESS_KEY, region: AWS_REGION });

  const s3 = new AWS.S3();

  const base64Data = new Buffer.from(base64.replace(/^data:image\/\w+;base64,/, ""), 'base64');

  const type = base64.split(';')[0].split('/')[1];

  const userId = 1;

  const params = {
    Bucket: S3_BUCKET,
    Key: `${userId}.${type}`, // type is not required
    Body: base64Data,
    ACL: 'public-read',
    ContentEncoding: 'base64', // required
    ContentType: `image/${type}` // required. Notice the back ticks
  }

  let location = '';
  let key = '';
  try {
    const { Location, Key } = await s3.upload(params).promise();
    location = Location;
    key = Key;
  } catch (error) {
  }

  console.log(location, key);

  return location;

}

module.exports = imageUpload;

阅读更多:http://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/S3.html#upload-property

致谢:https://medium.com/@mayneweb/upload-a-base64-image-data-from-nodejs-to-aws-s3-bucket-6c1bd945420f

【讨论】:

  • "new" 关键字不应出现在 Buffer.from 之前
【解决方案4】:

已接受的答案效果很好,但如果有人需要接受任何文件而不仅仅是图像,则此正则表达式效果很好:

/^data:.+;base64,/

【讨论】:

    猜你喜欢
    • 2015-09-05
    • 2014-06-26
    • 2016-12-26
    • 1970-01-01
    • 1970-01-01
    • 2013-08-27
    • 2018-07-16
    • 2014-08-15
    • 2012-06-26
    相关资源
    最近更新 更多