iOS拦截H5的input标签,实现图片处理

HTML的input标签在 type = "file" 时，即变为文件上传控件，浏览器会去监听这个标签，根据标签的另外一个 accept 字段的内容去调取各个平台的相关系统资源，如图片，视频，声音等，iOS也不例外。通过这个标签，移动端的H5页面就有直接获取系统资源的能力。但是有时候我们并不想让H5拿到原始的文件，或者是希望能够加工一下。比如：文件的压缩，文件格式转换，文件的编辑等。

也许大部分情况下我们会直接采用JS交互的方式。这种方式可定义和可控的程度都比较高，弊端也就是需要交互的地方都要跟H5协商好每个页面去写交互代码。

本文通过拦截的方式，笔者不认为是一种可靠的方案，因为随着iOS系统的升级很可能就变了，不利于项目的稳定，给维护带来麻烦。不过作为另外一种解决问题的思路，感兴趣还是可以看看的。

---

先以图片的获取为例

1. 寻找切入口

通过Debug View Hierarchy工具查看视图树寻找点击H5标签的弹窗
第一层

显然这个ActionSheet无法决定最终是哪一张图片，这个切入点不合适，我们再往里面看。