背景:随着前端发展越来越多的项目采用hybird方式进行开发,大部分的界面都是前端统一开发,原生只提供硬件提供、文件能力等;
目标:原生与前端交互方式大比拼
js调用原生通讯方式:
| 方式 | Android/iOS | 优势 | 劣势 | 使用场景 |
|---|---|---|---|---|
| url拦截 | 支持 | 没有漏洞问题 | 使用复杂 | 不需要返回值、简单场景 |
| 对象映射(推荐) | 支持 | 方便快捷、效率高 | 需要双方协商注册、android4.2存在漏洞问题 | 4.2以上相对简单互调场景 |
| 拦截alert() | 支持 | 方便快捷 | 没有返回值 | 不需要返回值 |
| 拦截confirm() | 支持 | 方便快捷、有返回值 | 2个返回值 | 能满足大多数互调场景 |
| 拦截prompt()(推荐) | 支持 | 方便快捷、有任意返回值 | 任意返回值 | 能满足大多数互调场景 |
原生调用js的通讯方式:
| 方式 | Android/iOS | 优势 | 劣势 | 使用场景 |
|---|---|---|---|---|
| loadurl | 支持 | 方便快捷、兼容性好 | 会导致页面刷新、效率低,性能差、没有返回值 | 不需要返回值、性能要求低的简单场景 |
| evaluateJavascript(推荐) | 支持 | 效率高、有返回值 | 兼容性差(iOS9/Android4.4以上) | 对效率要求高、低版本不需要兼容的场景 |