在线图片压缩工具

拖拽上传功能

使用HTML5 Drag and Drop API 实现图片拖拽上传功能。

支持事件：

- dragover：显示拖拽区域高亮效果

- dragleave：移除高亮效果

- drop：获取拖拽文件并处理

同时提供传统文件选择按钮作为备选方案。

图片压缩技术

使用 Canvas API 实现图片压缩：

1. 将图片绘制到Canvas上

2. 使用 toDataURL() 方法输出为JPEG格式

3. 通过 quality 参数控制压缩质量

压缩公式：

canvas.toDataURL('image/jpeg', quality/100)

质量参数范围：0.1（最低质量）到 1.0（最高质量）

图片缩放技术

使用Canvas进行图片缩放：

1. 计算缩放后尺寸：

scaledWidth = originalWidth * (scale/100)

scaledHeight = originalHeight * (scale/100)

2. 设置Canvas尺寸为缩放后尺寸

3. 使用 drawImage() 方法绘制缩放后的图片

缩放比例范围：10% 到 100%

隐私与安全

所有操作均在浏览器中完成：

- 图片不会上传到任何服务器

- 处理过程在用户设备上执行

- 无网络传输，保护用户隐私

使用 FileReader API 读取本地文件，

URL.createObjectURL() 生成下载链接。

处理完成后，及时释放内存资源。