之前实习做的一个移动端的页面 需要的功能有图片上传 点击客户端的返回按钮 有提示(即与客户端有交互) 遇到不少的坑 总结一下问题
1.图片上传功能 使用工具 百度的webuploader
暂时遇到的坑
1.1 删除图片 实际上并没有完全删除 需要自己在源码上添加
详情 看github的提问 https://github.com/fex-team/webuploader/issues/594
1.2 上传的图片 旋转角度有问题 比如 在上传页面看的图片缩略图 是水平显示的 但上传到后台 显示的是竖着的
详情可看 https://github.com/fex-team/webuploader/issues/476
文中作者有说到 这个需要和后台配合实现 因为如果在前端实现 会增加负担
(遇到这情况 就多多拜托后台哥哥吧
1.3 使用fastclick后 如果点击屏幕过快 会无法激活上传功能
这个是我发现最大的坑 可能也不关这个插件的事 因为不用fastclick的情况 是可以正常使用的
但在网上找了很多文章 都没有找到解决方法 最后 只能使用最蠢的方式来解决
正常情况 激活fastclick最直接粗暴的方式是
window.addEventListener('load', function() { FastClick.attach(document.body);}, false);
问题就出现在 fastclick激活的区域是整个body 那么尝试一下
不绑定webuploader的上传按钮 会如何呢?
https://github.com/ftlabs/fastclick
fastclick的github上有一处 是忽略激活的
但我给尝试了之后 发现并没有作用
最后用最蠢的方式是 获取各个需要清除300ms的元素 然后再一一激活fastclick
(这实在是太蠢了 但目前我是想不出好方法 只能这样将就用着了
1.4 暂未解决的坑
webuploader 在安卓机子上使用上传图片的时候 不能一次性选择多张图片(可能需要安卓客户端那边帮忙 暂未找到解决方法
ios 上 点击上传图片按钮 会有300ms延迟 (就算之前使用了fastclick激活整个body也会存在)
PS:其实最可怕的情况是 webuploader的git 好久没更新了 (好可怕。。
原标题:移动端开发(使用webuploader上传图片)
关键词:web