javascript。上传前旋转图像

我试图在发送图片之前在客户端浏览器上用javascript调整图片大小，这样可以节省带宽。代码运行良好，唯一的例外是从文件中读取EXIF的部分。 我认为问题在于函数

var exif=exif.readFromBinaryFile（newbinaryfile（e.target.result））

有人能帮我让它工作吗

这是我的密码：


函数doUpload（）{
var file=document.getElementById（'fileToUpload'）.files[0]；
var dataUrl=“”；
var img=document.createElement（“img”）；
var reader=new FileReader（）；
reader.onload=函数（e）
{
img.src=e.target.result；
var canvas=document.createElement（“canvas”）；
var ctx=canvas.getContext（“2d”）；
ctx.drawImage（img，0,0）；
reader.onloadend=函数（e）{
var exif=exif.readFromBinaryFile（新的二进制文件（e.target.result））；
开关（出口方向）{
案例2：
//水平翻转
ctx.translate（canvas.width，0）；
ctx.刻度（-1,1）；
打破
案例3：
//180°向左旋转
ctx.translate（canvas.width、canvas.height）；
旋转（数学PI）；
打破
案例4：
//垂直翻转
ctx.translate（0，画布高度）；
比例尺（1，-1）；
打破
案例5：
//垂直翻转+90向右旋转
ctx.旋转（0.5*Math.PI）；
比例尺（1，-1）；
打破
案例6：
//向右旋转90°
ctx.旋转（0.5*Math.PI）；
ctx.translate（0，-画布高度）；
打破
案例7：
//水平翻转+90向右旋转
ctx.旋转（0.5*Math.PI）；
ctx.translate（canvas.width，-canvas.height）；
ctx.刻度（-1,1）；
打破
案例8：
//向左旋转90°
ctx.旋转（-0.5*Math.PI）；
ctx.translate（-canvas.width，0）；
中断；}
}
//设置宽度和高度
var MAX_WIDTH=1024；
var MAX_HEIGHT=1024；
变量宽度=img.width；
var高度=img高度；
如果（宽度>高度）{
如果（宽度>最大宽度）{
高度*=最大宽度/宽度；
宽度=最大宽度；
}
}否则{
如果（高度>最大高度）{
宽度*=最大高度/高度；
高度=最大高度；
}
}
画布宽度=宽度；
canvas.height=高度；
var ctx=canvas.getContext（“2d”）；
ctx.drawImage（img，0，0，宽度，高度）；
dataUrl=canvas.toDataURL（“图像/jpeg”）；
document.getElementById（'image_preview'）。src=dataUrl；
//发布数据
var fd=新FormData（）；
fd.append（“图像”，dataUrl）；
var xhr=new XMLHttpRequest（）；
addEventListener（“进度”，uploadProgress，false）；
//xhr.addEventListener（“加载”，上载完成，错误）；
xhr.addEventListener（“错误”，上载失败，错误）；
xhr.addEventListener（“中止”，上载已取消，错误）；
open（“POST”，“uploadPicture.php”）；
xhr.send（fd）；
}
//将文件加载到文件读取器中
reader.readAsDataURL（文件）；
}
函数上载进度（evt）{
if（evt.长度可计算）{
var percentComplete=数学整轮（evt.loaded*100/evt.total）；
document.getElementById（'progress'）.innerHTML=percentComplete.toString（）+'%'；
}否则{
document.getElementById（'progress'）。innerHTML='Upload error！'；
}
}
功能上传完成（evt）{
警报（evt.target.responseText）；
}
函数上载失败（evt）{
警报（“文件上传错误！”）；
}
功能上载已取消（evt）{
警报（“上载中止或网络错误！”）；
}
<>代码>你的Reald.OnLoad Enter是异步的，在逻辑的中间是松散的。等待它在进入DRAWMAGE之前被触发。
 < P>你的Realth.OnLoad Enter是异步的，在逻辑的中间是松散的。等待它被触发，然后再继续drawImage。
控制台中出现任何错误
？无错误。简单地做笔记：（您是否也尝试过使用readAsBinaryString而不是readAsDataURL来读取图像？按原样执行。
控制台中的任何错误
？没有错误。简单地做笔记：（您是否也尝试过按原样使用readAsBinaryString而不是readAsDataURL来读取图像？）。