在Parse Cloud Code中旋转包含EXIF方向的上传图片

Question

从某些移动设备获取的

人像照片，通过HTML表单上传时，在嵌入网页时会出现错误的方向。

这是因为 EXIF orientation 元数据，例如可以使用值6 = Rotate 90 CW告诉图像以特定方向显示。但是，图像本身 - 没有元数据 - 作为水平图像横向存储。根据图像渲染器的不同，您将正确地看到图像（如下左侧缩略图所示）或未应用旋转元数据（作为右侧缩略图）。对于嵌入在网站中的图像，它是后者。

有没有办法在Parse Cloud Code托管的网络应用中使用Javascript或Node.js手动旋转上传的图片？ （仅解析云代码supports a few dependencies - 但您仍可以自己上传小脚本。）

Answer 1

您应该能够在云代码中使用npm模块：Using npm modules in cloud code

一旦你完成了工作，jpegorientation npm模块应该符合你的要求：

var jpeg = require('jpegorientation');

jpeg.autoRotate('image.jpg', function (err) {
    // error handler 
});

如果无法使npm模块正常工作，您可以随时手动包含库。如果您遇到该库和node-gyp的问题，还需要考虑其他模块：

• exif-rotate（结合exif或exif-component确定方向）
• fix-orientation（看起来基于浏览器）

Answer 2

我最终编写了一个客户端类，用于旋转和调整上传图像的大小。我正在使用Canvas元素和HTML5 FileReader。

有关源代码和一些示例，请参阅https://github.com/ajgarn/CanvasImageUploader。

该类为您提供图像数据（Blob），可以像通过FileReader上传文件一样发布到Parse's REST API。