主要介绍了JS和Canvas实现图片的预览压缩和上传功能,实现此功能大概有两步，第一步用户选择需要上传的图片，第二步获取图片资源压缩预览上传，具体实现代码大家参考下本

先来一张效果图，压压惊 第一步：用户选择需要上传的图片 在选定了图片后 upload 函数将被触发，我们需要在这个函数中，获取到图片的资源，将它压缩并利用canvas绘制出来，若需要上传到服务器，也可以利用ajax或者其他方式上传。 第二步：获取图片资源压缩预览上传 function upload() { let file = document.querySelector('input[type=f

上篇文章【Js利用Canvas实现图片压缩功能】中做了图片压缩上传，但是在IOS真机测试的时候，发现图片预览的时候自动逆时针旋转了90度。对于这个bug，我完全不知道问题出在哪里，接下来就是面向百度编程了。通过度娘找到了相关资料，解决方法记录在此。这个问题的具体因素其实我还是不清楚是为何导致的，只有IOS和部分三星手机会出现此bug。 绝大部分的安卓机并无此问题。 解决此问题需要引入一个第三方 JS 库： exif.js 下载地址：https://github.com/exif-js/exif-