混合 App 踩坑
做 hybrid app 时记下的一些 WebView 互通笔记。
~/posts/hybrid-app-notes $ cat post.md
最近在做 app。
混合 app 就是在原生 app 里用 WebView 一类的组件显示网页,Android 和 iOS 都支持。好处不少:更新更快、排版好做、代码量少。JS 也比 Java、Objective-C、Swift 灵活得多,请求里收到奇怪的 JSON 也好解;Gson 虽然强但相比之下变通空间小很多。缺点是有的,但整体可接受。
把这段时间的小 tip 简单备份一下,以后好查。
- iOS 端的 WKWebView 可以用 WebKit 全局变量从网页向原生发送类 Event 的消息。
- Android 端可以用拦截 Alert 的办法从网页发 Event 到原生。
- 以前听说过改 URL → 让原生读 URL 的做法,野得很。
- Android 端也可以用 WebView 类直接调 JS 里的全局方法。但 Browserify 打包出来的
build.js里,要把某些函数暴露到window上并不直观——肯定有正经办法,没找到就只能曲线救国:在 DOM 里塞一个隐藏元素、给它 id、把 Vue 的逻辑挂到它上面,然后用原生 HTML + JS 触发点击。不太优雅。
- 用 Meta 可以禁掉手机端的拖拽、缩放等。Android 端也可以走 WebSettings 的某个开关来统一适配所有页面。
- Meta 也能设 dpi 匹配,不设的话字会小到看不清。
- Browserify 用起来挺顺。
- 用虚拟路由可能会带来奇怪的问题;反正混合 app 里这种页面也不需要给用户提供后退按钮之类的入口,禁了就行。