我无法让照片在我的角度/节点应用程序中以正确的方式定向。
我的应用程序已设置为使用 ng2-file-upload 将文件从 Angular 应用程序发送到服务器,其中 multer 和 multer-s3 将该照片保存在 AWS S3 中。然后,我将文件名保存在 postgres 数据库中,并使用它通过 url 调用照片。
我的问题是,照片是由 iPhone 上传的(可能是其他我只尝试过 iPhone 的照片),然后返回时旋转到左侧。
我已经研究了服务器端的不同选项,但这些选项对我不起作用。这包括库 fix-orientation 和 jpeg-autorotate。
有没有人有在 Angular2+ 客户端实现的解决方案?
这是我在服务器端的图像上传代码
aws.config.loadFromPath(path3);
var s3 = new aws.S3();
var fileName = '';
var uploadM = multer({
storage: multerS3({
s3: s3,
bucket: 'XXX',
acl: 'public-read',
metadata: function (req, file, cb) {
console.log(file);
console.log(req.file);
cb(null, {fieldName: file.fieldname});
},
key: function (req, file, cb) {
fileName = Date.now().toString() + "-" + (Math.round(Math.random() * 10000000000000000)).toString() + '-' + file.originalname;
cb(null, fileName)
}
})
});
router.post('/upload', uploadM.array('photo', 3), function(req,res) {
if (res.error) {
return res.status(400).json({
message: "Error",
error: res.error
});
}
return res.status(200).send(fileName);
});
module.exports = router;
这是我在角度应用程序上的代码
public uploader:FileUploader = new FileUploader({url: this.devUrl, itemAlias: 'photo'});
constructor(
private userS: UserService,
private authS: MyAuthService,
private router: Router,
private itemS: ItemService,
private uis: UiService) {}
ngOnInit() {
this.uploader.onAfterAddingFile = (file)=> { file.withCredentials = false; };
this.uploader.onCompleteItem = (item:any, response:any, status:any, headers:any) => {
this.awsUrls.push('AWSURL' + response);
this.filesUploaded = true;
this.uploaderLoading = false;
};
}
addItem() {
this.uploaderLoading = true;
this.itemS.onNewItem(this.awsUrls)
.subscribe(data => {
this.uis.onFlash('Posted Successfully. Add Details!', 'success');
this.itemS.onSetUpdateItemId(data.id, false);
this.uploaderLoading = false;
this.onPhotoAdded();
}, resp => {
this.uploaderLoading = false;
this.uis.onFlash('Error Posting', 'error');
console.log(resp);
});
}
onUploadClicked() {
this.uploader.uploadAll();
this.uploaderLoading = true;
}