代码之家  ›  专栏  ›  技术社区  ›  Alien13

canvas.toBlob()和canvas.toDataURL是否正在压缩PNG?

  •  0
  • Alien13  · 技术社区  · 5 年前

    canvas.toDataURL

    当我尝试获取图像时,出现以下错误: Error: cURL error 61: Unrecognized content encoding type. libcurl understands deflate, gzip, br content encodings

    然后,我使用以下方式将其导出为PNG:

    const dataURL = canvas.toDataURL({
        width: canvas.width,
        height: canvas.height,
        left: 0,
        top: 0,
        format: 'png'
    })
    

    async function uploadPNG(dataURL, filePath) {
      const buf = Buffer.from(dataURL.replace(/^data:image\/\w+;base64,/, ""),'base64')
    
      const uploadParams = {
        Bucket: bucketName,
        ContentType: 'image/png',
        ContentEncoding: 'base64',
        Body: buf,
        Key: filePath
      }
    
      return await s3.upload(uploadParams).promise()
    }
    
    

    https://s3.eu-central-1.amazonaws.com/cdn.blankt.com/product/s/AY6AJSHMXnf2ReCZOu.png

    以下是该API请求的一部分:

    {
      "name": "AY6AJSHMXnf2ReCZOu",
      "type": "variable",
      "regular_price": "9.90",
      "sku": "AY6AJSHMXnf2ReCZOu",
    
      ...
    
      ],
      "images": [
        {
          "src": "https://s3.eu-central-1.amazonaws.com/cdn.blankt.com/product/s/AY6AJSHMXnf2ReCZOu.png"
        }
      ],
      "attributes" : [
        {
          "name"      : "Size",
          "variation" : true,
          "visible"   : true,
          "options"   : [ "A3", "A4", "A5" ]
        }
      ]
    }
    

    enter image description here

    这个问题似乎只出现在我尝试使用API上传图像时,如果我手动下载并上传图像到WooCommerce,就没有问题。

    0 回复  |  直到 5 年前
        1
  •  1
  •   Qwerasd    5 年前

    似乎您在s3上传中提供了无效的内容编码,在这里您提供了参数 ContentEncoding: 'base64' .

    这个 s3 SDK documentation 对于 upload ContentEncoding 参数:

    指定已应用于对象的内容编码,以及必须应用的解码机制,以获取内容类型标头字段引用的媒体类型。

    Content-Encoding MDN

    解决方案 :卸下 内容编码 从s3 upload参数——您首先并没有上传编码内容,因为当您将base64数据传递给用户时,您将其解码为原始字节 Buffer.from 'base64' 编码参数(参见 Buffer.from(string[, encoding]) character encodings 在Node.JS文档中)

    推荐文章