一、混和合作开发是甚么?
混和合作开发,是指在合作开发这款App商品的这时候,为的是降低成本、节约成本而借助原生植物与H5的合作开发设计的混和应用领域。浅显点而言,这是网页的商业模式,一般而言由“H5云中文网站+APP应用领域应用流程”三部份形成。
混和合作开发是一类互相学习的合作开发商业模式,原生植物标识符部份借助应用领域流程或是其他架构为H5提供更多罐子,流程主要就的销售业务同时实现、介面展现都是借助与H5有关的控制技术展开同时实现的。许多APP都是借助混和合作开发商业模式而成的。
二、web网页和ios,android展开可视化(基本原理)
web网页和ios,android展开可视化(基本原理)
web网页初始化ios和androidweb网页推送两个假的允诺, ios,android截击允诺,导出是真允诺却是假允诺真允诺离境假允诺截击,导出出真实世界的机能市场需求表头,透过正式发布订户,传达给适当文档,作出适当的操作方式 推送两个假允诺,让原生植物合作开发截击(该加允诺的url路劲须要和ios,android增设的完全一致) ios截击允诺
// 承继类MyURLProtocol,常量NSURLProtocol
// MyURLProtocol.h文档
#import <Foundation/Foundation.h>NS_ASSUME_NONNULL_BEGIN
@interface MyURLProtocol: NSURLProtocol
@end
// MyURLProtocol.m文档#import “MyURLProtocol.h”@implementation MyURLProtocol
// 智能手机app与否能读取请求
+(BOOL)canInitWithRequest:(NSURLRequest *)request{= request.URL.absoluteString;
// 推论数组与否以商谈好的不实协定结尾(如emma://结尾)
if([path hasPrefix:@“emma://”]){// 这是个假= [path substringFromIndex:7];// 该文档无法初始化许多原生植物机能,须要配有webview的快照文档才行,因此要将该允诺表头传予快照文档
// 文档间无法通信,用正式发布订户(ios自带两个正式发布订户)if([action isEqualToString:@“captureImage”]){
// 推送消息,拍照
[[NSNotificationCenter defaultCenter] postNotificationName:@“captureImage”object:nil userInfo:nil];
}
// 截击掉该允诺
return NO;
} else {
// 真允诺
// 允许该允诺透过
return YES;
}
}@end
// 配有webview的网页(文档)#import “MyURLProtocol.h”
// 注册MyURLProtocol,能同时实现截击
[NSURLProtocol registerClass:[MyURLProtocol class]];
// 订户消息,拍照的消息
[[NSNotificationCenter defaultCenter]addObserver:self selector:@selector(handleCaptureImage) name:@“captureImage” object:nil];
// 订户拍照消息的处理函数
–(void)handleCaptureImage{
// 拍照的操作方式
}
html推送假允诺
<!– // HTML文档推送假允诺 –>
<a href=“emma://captureImage”>拍照</a>
<a href=“emma://openweChart”>打开微信</a>
<a href=“emma://scan”>扫一扫</a>// js文档推送假允诺
window.location.href = emma://captureImage;
ios,android传值给web网页 先在网页上准备两个获得结果的回调函数 当原生植物须要传值给网页时,向打开网页的窗口动态插入js标识符,这段js标识符是初始化回调函数的标识符 web标识符
import React,{ useState } from react
function WebView() {
const [image, setimage] = useState();
const btnAction = () => {
// 推送两个假的允诺,触发原生植物
window.location.href = emma://captureImage;// 在window增设了两个回调方法(模块化合作开发,ios只能找到window全局作用域,因此只能挂在window上)
window.onCaptureImageCallback = (value) => {
setimage(value)
}
}
return (<div>
<buttononClick={btnAction}>拍照</button>
<img src={image} />
</div>
)
}
ios标识符
// webview的文档
// 须要将webview提升成全局变量(挂载webview的函数和处理正式发布订户事件的函数是两个作用域)
@property(strong, nonatomic) WKWebView *webview;
// 事件处理函数中
// 向窗口注入js标识符
NSString *jsMethod = [NSString stringWithFormat:@“window.onCaptureImageCallback(%@)”, @“须要传予网页的值”];
[self.webview evaluateJavaScript:jsMethod completionHandler:nil];