这些功能是用在前几天写的一个小程序上的，所以本文是以小程序为主要框架讲解。但其实你不懂小程序也没关系，懂js就可以啦，重点讲如何用canvas实现这些功能，学会活学活用运算canvas的坐标才是关键。😄 在拖拽组件内通过小程序的apiwx.createCanvasContex…

传统的 form 表单上传 隐藏 iframe 模拟 Ajax（跨域）上传 HTML5 特性实现 Ajax 上传 检校图片信息

在开发 H5 应用的时候碰到一个问题， 应用只需要一张小的缩略图， 而用户用手机上传的确是一张大图， 手机摄像机拍的图片好几 M，这可要浪费很多流量。 像我这么为用户着想的程序员，绝对不会让这种事情发生的， 于是就有了本文。

我们在开发系统时，处理图片上传是不可避免的，例如使用 thinkphp 的肯定很熟悉 import("@.ORG.UploadFile"); 的上传方式，今天我们来讲一个使用 html5 base64 上传图片的方法。

图片的上传一般情况下不需要上传大体积的图片，因为如果是用户头像或者是一些要求清晰度不是太高的场景上传大体积图片会很消耗资源，一个是上传耗时比较长，同时也增加了存储的开销，当展示的时候也会消耗下载的带宽，影响加载效率。要求用户上传的图片之前压缩图片很影响用户体验，所以就增加了在前…

使用 File API 上传普通文件，结合 canvas 客户端压缩图片，并实现文件上传服务端

作者：孙辉，美团金融前端团队成员。15年毕业加入美团，相信技术，更相信技术只是大千世界里知识的一种，个人博客: https://sunyuhui.com 陆陆续续做了不少需要上传图片的项目，场景各种各样，从前后端数据交互来看，有直接从浏览器里发ajax到后端，也有用Node做中…

解决上传头像类似功能在Android 7.0上的兼容问题

由于前端是不能直接操作本地文件的，要么通过用户点击选择文件或者拖拽的方式，要么使用 flash 等第三方的控件，但 flash 日渐衰落，所以使用 flash 还是不提倡的。同时 html5 崛起，提供了很多的 api 操控，可以在前端使用原生的 api 实现图片的处理，这样可以减少后端服务器的压力，同时对用户也是友好的