Question

我遇到一个问题，当我将图像上传到Firebase存储器时，有时会旋转。我已经读到，这主要是EXIF元数据存在的iOS问题。

是的，我已经用Google搜索了它，并且找到了很多答案，但是其中大多数似乎是关于使用EXIF元数据来定位图像。但是，我相信我的问题是我的EXIF数据没有发送到Firebase服务器，因此认为我的图像已旋转。我尝试使用一些JavaScript库通过其EXIF数据显示图像，但还是没有运气。

也有人建议在发送/接收之前或之后旋转图像，但是，我不知道我的用户是否正在上传有此问题的图像。

这是我的上传请求

/**
 * Upload image for profile
 */
exports.uploadImage = (req, res) => {
    const BusBoy = require('busboy');
    const path = require('path');
    const os = require('os');
    const fs = require('fs');

    const busboy = new BusBoy({ headers: req.headers });

    let imageFileName;
    let imageToBeUploaded = {};

    busboy.on('file', (fieldname, file, filename, encoding, mimetype) => {
        if(mimetype !== 'image/jpeg' && mimetype !== 'image/png'){
            return res.status(400).json({error: 'Wrong file type submitted'});
        }
        const imageExtension = filename.split('.')[filename.split('.').length - 1];
        imageFileName = `${Math.round(Math.random() * 1000000)}.${imageExtension}`;
        const filepath = path.join(os.tmpdir(), imageFileName);
        imageToBeUploaded = { filepath, mimetype };
        file.pipe(fs.createWriteStream(filepath));
    });
    busboy.on('finish', () => {
        admin.storage().bucket().upload(imageToBeUploaded.filepath, {
            resumable: false,
            metadata: {
                metadata: {
                    contentType: imageToBeUploaded.mimetype
                }
            }
        })
            .then(() => {
                const imageUrl = `https://firebasestorage.googleapis.com/myurl`;
                return db.doc(`/users/${req.user.handle}`).update({ imageUrl: imageUrl });
            })
            .then(() => {
                return res.json({ message: 'Image uploaded successfully' });
            })
            .catch(err => {
                console.error(err);
                return res.status(500).json({ error: err.code });
            });
    });
    busboy.end(req.rawBody);
}

这是我的React前端抓取图像文件

handleImageChange = event => {
    const image = event.target.files[0];
    console.log(image);
    //Send to server
    const formData = new FormData();
    formData.append("image", image, image.name);
    this.props.uploadImage(formData);
  };

然后我使用axios发出请求

xport const uploadImage = formData => dispatch => {
  dispatch({ type: LOADING_USER });
  Axios.post("/user/image", formData)
    .then(() => {
      dispatch(getUserData());
    })
    .catch(err => {
      console.log(err);
    });
};

感谢您的帮助。

Firebase Storage React Upload中的旋转图像

0 个答案: