前言
近期完成了APP部分模块使用h5替换，学习的Vue也终于派上用场，总体而言开发效率很快，能实现热更新，内心自然是极度喜悦😊😊，又掌握了新技能
环境搭建，插件开发，自定义插件就不再介绍了，资源很多，在此仅记录遇到的问题，当然也希望能够帮助正在阅读的你
问题一 拦截ajax请求，并原生返回请求数据
初接到这个需求也是两眼懵逼，经过翻墙也算是有所了解，用到的类为NSURLProtocol，后续需要继承NSProtocol，子类实现具体方法，具体在startLoading方法实现，关键代码
NSURLResponse *newresponse = [[NSURLResponse alloc] initWithURL:self.request.URL
MIMEType:@"application/octet-stream"
expectedContentLength:data.length
textEncodingName:nil];
//将新的response作为request对应的response
[self.client URLProtocol:self
didReceiveResponse:newresponse
cacheStoragePolicy:NSURLCacheStorageNotAllowed];
//设置request对应的 响应数据 response data
[self.client URLProtocol:self didLoadData:data];
//标记请求结束
[self.client URLProtocolDidFinishLoading:self];
问题二 拦截URL，加载本地h5资源文件
主要继承NSURLCache，子类实现具体逻辑，关键代码
// 尽可能的提前，一般放在appdelegate
HTURLCache *cache = [[HTURLCache alloc] init];
[cache setMemoryCapacity:4 * 1024 * 1024];
[cache setDiskCapacity:24 * 1024 * 1024];
[NSURLCache setSharedURLCache:cache];
// 获取某一请求的缓存方法
- (NSCachedURLResponse *)cachedResponseForRequest:(NSURLRequest *)request
// 读取本地资源返回
NSString *mimeType = [HTCordovaTools getMIMETypeWithCAPIAtFilePath:filePath];
//合成NSCachedURLResponse对象，返回
NSURLResponse *response = [[NSURLResponse alloc] initWithURL:[request URL]
MIMEType:mimeType
expectedContentLength:[fileData length]
textEncodingName:nil];
NSCachedURLResponse *cachedResponse = [[NSCachedURLResponse alloc] initWithResponse:response data:fileData];
问题三 h5问题，iOS状态栏不能填充
经查阅：h5标准中meta是一个非常重要的标签，本次问题的修复需要应用其中一个属性viewport-fit，该属性有3个对应值：
- 1 contain，可视窗口完全包含网页内容。
- 2 cover，网页内容完全覆盖可视窗口。
- 3 auto，默认值，表现与contain一致。
<meta name="viewport" content="initial-scale=1, width=device-width, height=device-height, maximum-scale=1, minimum-scale=1, user-scalable=no, viewport-fit=cover">
在设置viewport-fit=cover好后，就会发现网页上下左右都会被吃掉一些。然后我们还要引入一个css常量safe-area-inset-
- 1 safe-area-inset-top
- 2 safe-area-inset-bottom
- 3 safe-area-inset-left
- 4 safe-area-inset-right
分别表示 Safe area 和可视窗口viewport顶部，右边，左边，底部的间距，可以用于设置margin, padding, 或者绝对定位时left, top。
上面的常量写入css时需要一个函数 constant（）来解析。
header {
/* Status bar height on iOS 11.0 */
padding-top: constant(safe-area-inset-top);
/* Status bar height on iOS 11.2+ */
padding-top: env(safe-area-inset-top);
}
问题四 禁用整个应用页面的上下拖动效果（防止拖动出现黑边）
在 config.xml 中进行如下设置
<preference name="WebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
