ios和h5混合开发,h5 ios和安卓兼容总结

APP原生开发和H5开发以及APP混合开发三者有什么区别？

这个如果详细说，那就是很复杂了，但是可以以口语方式简单的说

成都创新互联专注为客户提供全方位的互联网综合服务，包含不限于成都网站建设、成都网站制作、明山网络推广、小程序开发、明山网络营销、明山企业策划、明山品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等，从售前售中售后，我们都将竭诚为您服务，您的肯定，是我们最大的嘉奖；成都创新互联为所有大学生创业者提供明山建站搭建服务，24小时服务热线：13518219792，官方网址：www.cdcxhl.com

APP原生开发：就是安卓版，IOS版，和后台，最起码为3个人制作，3个不同的人掌握不同的技术，也就是说，这个成本最高。

H5开发：就是HTML5的网页制作，也可以理解为网页制作，然后加个壳打包，这个壳和打包对于外行也是比较模糊的概念，你只需要理解为最简单的html5制作就行，这个没有什么技术含量，也最便宜。一个人可以搞定。

APP混合开发：这个是介于原生开发和H5开发之间的，难度也是居中，相对来说，技术上由2个人完成，一个前台一个后台，APP上有H5的制作内容，也有原生开发的制作内容，所以叫混合开发，或者说也有WEB开发的痕迹，这个是不能一句话说清楚的。

从价格来说这样排列：最贵原生开发，居中混合开发，最便宜H5开发。

iOS和h5交互(WKWebView,UIWebView)

app 混合开发场景中 常常涉及到h5 和原生数据通信，大致分为2类 一个是 原生 向 h5 主动通信，一个是 h5 主动向 原生通信。

iOS 中加载h5的 控件有2种，UIWebView 和 WKWebView,目前新提交的app 必须使用WKWebView 才能提交审核。已经上架审核成功的app 目前没有强制要求必须用WKWebView。

原生通过监听url 变化实现，当url 变化的时候 ,会触发

h5 主要逻辑如下

除了 通过url 变化 的监听外，我们还有其他方法，比如通过 JSContext 向webView 注入。具体步骤如下

原生逻辑：

第一步：新建1个继承 JSExport 的 代理 ，新建1个继承该协议的类，协议中 opencame 为和 前端约定好的 通讯方法

第二步：webview 加载成功后 ，在 - (void)webViewDidFinishLoad:(UIWebView *)webView 注入,注入对象名称 为 cth5bridge

第三步：h5 调用方式如下，cth5bridge 为注入对象名称，opencame 为 约定的方法

假设1个场景，用户访问h5 界面情况下，我们要通知 用户token 要更新

原生主要逻辑

h5 主要逻辑

假设1个场景，用户点击1个活动baner,通知原生 以一个新的界面 打开1个外部活动h5界面

和上面类似，我们也可以在 - (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler 通过监听 url 变化来实现

原生主要逻辑

h5 主要逻辑

我们也可以这么做

第一步 原生 注册 监听方法 showH5

第二步 H5 调用 和原生约定好的方法 showH5，h5 处理的时候要区分 iOS 和 android，下面 只是考虑iOS

第三步 原生在 - (void)userContentController:(nonnull WKUserContentController *)userContentController didReceiveScriptMessage:(nonnull WKScriptMessage *)message 进行监听

和上面类似，假设1个场景 通知H5 刷新用户token

updatetoken 是和前端H5 约定好的 通信方法，123是传递的数据，一般 以 json 字符串传递

原生主要逻辑

H5主要逻辑

需要在windows 上 绑定方法

参考链接：

H5端与原生混合开发遇到的一些问题

在与原生安卓/IOS实现混合开发时，会遇到一些问题，在此做下记录（以下是目前遇到的或之前有记录到的一些问题，后续如果有遇到新的问题或整理过程中发现其他的一些问题再补上）：

1.H5页面拨打电话问题

（1）在移动端页面实现时，只需使用a标签，a href="tel:1234567"即可实现。

（2）与原生混合开发时，安卓端嵌入我们的H5页面，采用以上方式却无法实现，（IOS端是没有问题的），因此需要调用原生本地的拨打电话方法。

2.IOS时间的一个兼容性问题

H5页面实现过程中遇到了时间处理的问题。使用new Date(time).getDay()的时候，正常返回应该的是0-6，对应每周的星期日到星期一，但在IOS上，例如：我们使用的是（2018-6-4）的话，它会返回undefined。因此我们在这里应该对这个时间格式进行处理，将其改为（2018/6/4）的格式去获取。

即：new Date("2018-06-04").replace(/-/g ,"/");