混合app开发,h5页面调用ios原生APP的接口
混合APP开发中,前端开发H5页面,不免会把兼容性拉进来,在做页面的兼容性同事,会与原生app产生一些数据交互;
混合APP开发,安卓的兼容性倒是好说,安卓使用是chrome浏览器核心,已经很好兼容H5页面,而且运行机制也是能够同步运行;但ios上就没那么容易了;、
在此我就不说兼容安卓的问题,只把ios问题说说;
问题1:H5调用ios接口,ios需要初始化,js代码在ISO上只运行一次
解决:
本人使用是angular框架搭建的H5页面
var ua = navigator.userAgent.toLowerCase();
if (/iphone|ipad|ipod/.test(ua)) {
$rootScope.$on("$locationChangeSuccess",function(){
parent.location.reload();
})
}
意思就是每一次hH5页面加载成功就让其刷新一次;
问题2:ios初始化只执一次,这是由于ios本身内部机制问题;ios执行代码执行一次就储存在缓存中,但是js需要再次执行,否则功能实现不了;
解绝:ISO初始化只执行一次,这是ios本身机制,无法改变;
调用其他接口,只能在第一次初始化的函数中执行,也就是说每个js文件只能有一个ios初始化,其他有关需要初始化操作的东西都要写在初始化函数中;
function connectWebViewJavascriptBridge(callback) {
if (window.WebViewJavascriptBridge) {
callback(WebViewJavascriptBridge)
} else {
document.addEventListener('WebViewJavascriptBridgeReady', function () {
callback(WebViewJavascriptBridge)
}, false)
}
}
connectWebViewJavascriptBridge(function(bridge) {
bridge.init(function (message, responseCallback) {
var data = {'Javascript Responds': 'Wee!'}
responseCallback(data)
})
bridge.registerHandler('testJavascriptHandler', function (data, responseCallback) {
var responseData = {'Javascript Says': 'Right back atcha!'}
responseCallback(responseData)
})
bridge.callHandler('接口名称', {
'': '接口名称',
'body': {"接口名称": '111'}
}, function (response) {
//接口请求来的数据操作
})
$("body").click(function(){
bridge.callHandler('接口名称', {
'': '接口名称',
'body': {"接口名称": '111'}
}, function (response) {
//接口请求来的数据操作
})
})
})
}
包括点击操作请求接口都要放在初始化函数中;
以上内容为自己总结,有错敬请指出,谢绝复制转载
混合app开发,h5页面调用ios原生APP的接口的更多相关文章
- uni-app&H5&Android混合开发三 || uni-app调用Android原生方法的三种方式
前言: 关于H5的调用Android原生方法的方式有很多,在该片文章中我主要简单介绍三种与Android原生方法交互的方式. 一.H5+方法调用android原生方法 H5+ Android开发规范官 ...
- 【如何快速的开发一个完整的iOS直播app】(美颜篇)
原文转自:袁峥Seemygo 感谢分享.自我学习 前言 在看这篇之前,如果您还不了解直播原理,请查看这篇文章如何快速的开发一个完整的iOS直播app(原理篇) 开发一款直播app,美颜功能是很重 ...
- 【如何快速的开发一个完整的 iOS 直播 app】(美颜篇)
来源:袁峥Seemygo 链接:http://www.jianshu.com/p/4646894245ba 前言 在看这篇之前,如果您还不了解直播原理,请查看这篇文章如何快速的开发一个完整的iOS直播 ...
- 【如何快速的开发一个简单的iOS直播app】(代码篇)
开篇([如何快速的开发一个完整的iOS直播app](原理篇)) 好久没写简书,因为好奇的我跑去学习直播了,今天就分享一下我的感慨. 目前为止直播还是比较热点的技术的,简书,git上有几篇阅读量和含金量 ...
- 如何快速的开发一个完整的iOS直播app(美颜篇)
前言 在看这篇之前,如果您还不了解直播原理,请查看这篇文章如何快速的开发一个完整的iOS直播app(原理篇) 开发一款直播app,美颜功能是很重要的,如果没有美颜功能,可能分分钟钟掉粉千万,本篇主要讲 ...
- 基于Jquery WeUI的微信开发H5页面控件的经验总结(2)
在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI ...
- 【如何快速的开发一个完整的iOS直播app】(原理篇)
原文转自:袁峥Seemygo 感谢分享.自我学习 目录 [如何快速的开发一个完整的iOS直播app](原理篇) [如何快速的开发一个完整的iOS直播app](播放篇) [如何快速的开发一个完整的 ...
- 如何快速的开发一个完整的iOS直播app(原理篇)
目录 [如何快速的开发一个完整的iOS直播app](原理篇) [如何快速的开发一个完整的iOS直播app](播放篇) [如何快速的开发一个完整的iOS直播app](采集篇) 前言 大半年没写博客了,但 ...
- 基于Jquery WeUI的微信开发H5页面控件的经验总结(1)
在微信开发H5页面的时候,往往借助于WeUI或者Jquery WeUI等基础上进行界面效果的开发,由于本人喜欢在Asp.net的Web界面上使用JQuery,因此比较倾向于使用 jQuery WeUI ...
随机推荐
- ext.net tooltip
业务场景:需要对grid表格中指定列显示tooltip. html: <form id="form1" runat="server"> <To ...
- 02-Sockent客户端
package com.day1; import java.io.IOException; import java.io.OutputStream; import java.net.Inet4Addr ...
- Jsp九大内置对象和4大作用域
一.在java开发中,jsp提供了9个内置的对象,这些内置对象将由容器为用户进行实例化,用户直接使用. 这9个内置对象分别为:pageContext,request,response,session, ...
- DELPHI中自定义消息的发送和接收
DELPHI中的消息处理机制 Delphi是Borland公司提供的一种全新的WINDOWS编程开发工具.由于它采用了具有弹性的和可重用的面向对象Pascal(object-orientedpasca ...
- browserify 不打包某些文件或者把公共文件提取出来教程
var gulp = require('gulp') var fs = require("fs") var babelify = require('babelify') var b ...
- Install and Configure Apache Kafka
I. Installation The installation environment must have JDK, verify that you enter: java -version 1. ...
- 使用FPM打包工具打rpm包
使用FPM打包工具打rpm包 一:安装ruby环境和gem命令 fpm 是 ruby写的,因此系统环境需要ruby且版本必须大于1.8.5 # yum -y install ruby rubygems ...
- Linux性能优化 第二章 性能工具:系统CPU
2.1 CPU性能统计信息 2.1.1运行队列统计 在Linux中,一个进程要么是可运行的,要么是阻塞的(正在等待一个事件的完成).阻塞进程可能在等待从I/O设备来的数据,或者是系统调用的结果如果一个 ...
- Centos下添加用户并赋权
创建新用户 创建一个用户名为:linuxidc [root@localhost ~]# adduser linuxidc 为这个用户初始化密码,linux会判断密码复杂度,不过可以强行忽略: [roo ...
- HTTP 416
真是活久见, 竟然遇到了HTTP 416 参照 http://baike.baidu.com/view/1790469.htm , Requested Range Not Satisfiable 如果 ...