ios剪切后输出为黑色（透明图片）

[assursu]

截取 canvas 坐标，点在了 canvas 外，无法获取图像

[lijiayi01]

这是ios拍摄图片角度问题。
解决方案：
1.引入exif库，取到图片orientation
2. 在manual-crop/index.js里做一下偏转处理(只截取了部分代码)
function handleCrop (info, params, resolve) {
let $el
// 旋转图片
if (params.angle > 0) {
$el = rotateImage(info.element, params.angle)
info.width = params.naturalWidth
info.height = params.naturalHeight
info.element = $el
}
if(info.orientation == 6){
$el = rotateImage(info.element, 90)
info.width = params.naturalWidth
info.height = params.naturalHeight
info.element = $el
}else if(info.orientation == 8){
$el = rotateImage(info.element, 270)
info.width = params.naturalWidth
info.height = params.naturalHeight
info.element = $el

}else if(info.orientation == 3){
$el = rotateImage(info.element, 180)
info.width = params.naturalWidth
info.height = params.naturalHeight
info.element = $el
}

其实作者已经给出了解决方案，只要未考虑ios拍摄问题而已。

[HShao0130]

请问解决了吗？

[lijiayi01]

issue已经提供了方法，你可以试试

…

------------------ 原始邮件 ------------------ 发件人: "HShao0130"<[email protected]>; 发送时间: 2019年6月19日(星期三) 下午2:41 收件人: "capricorncd/image-process-tools"<[email protected]>; 抄送: "Tra"<[email protected]>; "Comment"<[email protected]>; 主题: Re: [capricorncd/image-process-tools] ios剪切后输出为黑色（透明图片） (#13) 请问解决了吗？ — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[HShao0130]

@lijiayi01 可以了。感谢

[HShao0130]

@lijiayi01 你好，按照你提供的思路现在遇到一点问题，竖屏拍照现在已经没问题了，但是横屏拍照还是会有同样的问题。使用这个方法之前是横竖都会有问题的。下面是我的代码：

const self_img = document.createElement('img');
self_img.src = info.base64;
EXIF.getData(self_img, function () {
  info.orientation = EXIF.getTag(this, 'Orientation');
  console.log('Orientation:' + info.orientation);
});
alert(info.orientation)
if (info.orientation == 6) { // 竖屏
    $el = rotateImage(info.element, 90)
    info.width = params.naturalWidth
    info.height = params.naturalHeight
    info.element = $el
} else if (info.orientation == 8) { // 倒立竖屏
    $el = rotateImage(info.element, 270)
    info.width = params.naturalWidth
    info.height = params.naturalHeight
    info.element = $el
} else if (info.orientation == 3) {
    $el = rotateImage(info.element, 180)
    info.width = params.naturalWidth
    info.height = params.naturalHeight
    info.element = $el
}

[lijiayi01]

@lijiayi01 你好，按照你提供的思路现在遇到一点问题，竖屏拍照现在已经没问题了，但是横屏拍照还是会有同样的问题。使用这个方法之前是横竖都会有问题的。下面是我的代码：

const self_img = document.createElement('img');
self_img.src = info.base64;
EXIF.getData(self_img, function () {
  info.orientation = EXIF.getTag(this, 'Orientation');
  console.log('Orientation:' + info.orientation);
});
alert(info.orientation)
if (info.orientation == 6) { // 竖屏
    $el = rotateImage(info.element, 90)
    info.width = params.naturalWidth
    info.height = params.naturalHeight
    info.element = $el
} else if (info.orientation == 8) { // 倒立竖屏
    $el = rotateImage(info.element, 270)
    info.width = params.naturalWidth
    info.height = params.naturalHeight
    info.element = $el
} else if (info.orientation == 3) {
    $el = rotateImage(info.element, 180)
    info.width = params.naturalWidth
    info.height = params.naturalHeight
    info.element = $el
}

可以提供一下设备系统，我测试系统为：6sp，10.3.1

[HShao0130]

@lijiayi01 测试设备：iphonex , ios 12.3.1

[lijiayi01]

iphonex 12.2 也没问题啊。

…

------------------ 原始邮件 ------------------ 发件人: "HShao0130"<[email protected]>; 发送时间: 2019年6月20日(星期四) 上午10:45 收件人: "capricorncd/image-process-tools"<[email protected]>; 抄送: "Tra"<[email protected]>;"Mention"<[email protected]>; 主题: Re: [capricorncd/image-process-tools] ios剪切后输出为黑色（透明图片） (#13) @lijiayi01 测试设备：iphonex , ios 12.3.1 — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub, or mute the thread.