如何在浏览器中通过Javascript压缩图像？

如何在浏览器中通过Javascript压缩图像？

简而言之：

• 使用HTML5 FileReader API和.readAsArrayBuffer读取文件
• 使用文件数据创建一个Blob，然后使用window.URL.createObjectURL（blob）获取其url。
• 创建新的Image元素并将其src设置为文件blob url
• 将图像发送到画布。画布尺寸设置为所需的输出尺寸
• 通过canvas.toDataURL（“ image / jpeg”，0.7）从画布获取按比例缩小的数据（设置您自己的输出格式和质量）
• 将新的隐藏输入附加到原始表单，并基本上以普通文本的形式传输dataURI图像
• 在后端，读取dataURI，从base64解码并保存