此文为了解决 WKWebView 使用 NSURLProtocol 协议支持 webp 格式图片所导致 ajax 发出POST请求body为空的BUG，body 为空意味着服务端获取不到前端页面的 POST 参数，导致请求失败。
问题描述
如果要让 WKWebView 强制支持 NSURLProtocol 协议，必须使用以下方式。
1. 新建一个 WKWebView 分类， 实现以下方法
- (void)registerScheme:(NSString *)scheme {
if (!scheme.length) {
return;
}
// 注册scheme
// 获取 WebKit WKBrowsingContextController 实例
Class cls = [[self valueForKey:@"browsingContextController"] class];
SEL selector = NSSelectorFromString(@"registerSchemeForCustomProtocol:");
if ([cls respondsToSelector:selector]) {
// 以下方法类似：performSelector:withObject:
IMP (*func)(id, SEL, id) = (void *)[cls methodForSelector:selector];
func(cls, selector, scheme); // 注册 Scheme
}
}
2. 在 WKWebView 创建之后调用上面的方法
[webView registerScheme:@"http"];
[webView registerScheme:@"https"];
3. 注册自定义 NSURLProtocol 协议
// WebPURLProtocol 就是用于对 webp 图片进行重定向的协议
[NSURLProtocol registerClass:[WebPURLProtocol class]];
在 WebPURLProtocol 实现相应的 webp 判断和重定向逻辑之后即可加载 webp 图片，但是会出现文章开头提到的问题。
解决办法
ajax 发出的 GET 请求是没问题的，POST 请求 body 会丢失，是因为 webp 图片的链接也是 http 或者 https 开头的 Scheme，在上面我们为 WKWebView 支持 NSURLProtocol 协议注册了 http 和 https 协议，从而让 WKWebView 强制走我们自定义的 NSURLProtocol ，即使我们只对 webp 格式图片的链接做拦截进行重定向（正常的请求放过），但 ajax 发出POST请求还是 body 为空（原因请参考上一篇文章：https://www.jianshu.com/p/634d66e60400 ），如果我们去掉 http https 的注册，一切恢复正常，但舍弃了 webp 的功能。
为此想到了一个办法，那就是为 webp 格式图片自定义一个 scheme 单独处理（需要和前端后端约定这个 scheme），假定这个 scheme 就是 webphttp、webphttps
[webView registerScheme:@"webphttp"]; // 相当于 http
[webView registerScheme:@"webphttps"]; // 相当于 https
备注：前端或者后端只需要在图片链接前面拼接上 webp 标识即可， app 端只需在重定向的时候截取掉 webp 标识即可请求
然后在 WebPURLProtocol 中只针对 webphttp 和 webphttps 自定义 scheme 进行处理，具体实现细节代码如下：
#import "WebPURLProtocol.h"
#import <SDWebImage/UIImage+WebP.h>
#import <SDWebImage/SDWebImageManager.h>
NSString *const kWebPPrefix = @"webp";
@interface WebPURLProtocol ()
@property (strong, nonatomic) id <SDWebImageOperation> downloadOption;
@end
@implementation WebPURLProtocol
+ (BOOL)canInitWithRequest:(NSURLRequest *)request {
// POST 不进行拦截
if ([request.HTTPMethod isEqualToString:@"POST"]) {
return NO;
}
if ([request.URL.scheme hasPrefix:kWebPPrefix]) { // 如果是 webp 自定义图片协议
if ([NSURLProtocol propertyForKey:@"URLProtocolHandledKey" inRequest:request]) {
return NO;
}
return YES;
}
return NO;
}
+ (NSURLRequest *)canonicalRequestForRequest:(NSURLRequest *)request {
if ([request.URL.scheme hasPrefix:kWebPPrefix]) { // 如果是 webp 自定义图片协议
NSMutableURLRequest *mRequest = [request mutableCopy];
// 过滤自定义协议头
NSMutableString *mUrl = [request.URL.absoluteString mutableCopy];
NSRange r = [mUrl rangeOfString:kWebPPrefix];
[mUrl deleteCharactersInRange:r]; // 删除 webp 前缀
mRequest.URL = [NSURL URLWithString:[mUrl copy]];
return [mRequest copy];
}
return request;
}
+ (BOOL)requestIsCacheEquivalent:(NSURLRequest *)a toRequest:(NSURLRequest *)b {
return [super requestIsCacheEquivalent:a toRequest:b];
}
- (void)startLoading {
// 重定向请求
NSMutableURLRequest *mRequest = [[self request] mutableCopy];
// 标识该request已经处理过了，防止无限循环
[NSURLProtocol setProperty:@YES forKey:@"URLProtocolHandledKey" inRequest:mRequest];
self.downloadOption = [[SDWebImageManager sharedManager] loadImageWithURL:[self request].URL options:0 progress:nil completed:^(UIImage * _Nullable image, NSData * _Nullable data, NSError * _Nullable error, SDImageCacheType cacheType, BOOL finished, NSURL * _Nullable imageURL) {
// 通知 client 收到响应
NSURLResponse *response = [[NSURLResponse alloc] initWithURL:mRequest.URL MIMEType:@"image/jpeg" expectedContentLength:data.length textEncodingName:nil];
[self.client URLProtocol:self didReceiveResponse:response cacheStoragePolicy:NSURLCacheStorageAllowed];
// 通知 client 已经加载完数据
[self.client URLProtocol:self didLoadData:UIImageJPEGRepresentation(image, 1.0f)];
// 通知 client 请求完成, 成功或者失败的处理
if (!error) {
//成功
[self.client URLProtocolDidFinishLoading:self];
} else {
//失败
[self.client URLProtocol:self didFailWithError:error];
}
}];
}
- (void)stopLoading {
// 终止任务
if ([self.downloadOption conformsToProtocol:@protocol(SDWebImageOperation)]) {
[self.downloadOption cancel];
}
}
@end
