I’m encountering an issue with CSS not displaying when using WKURLSchemeHandler to load local HTML files.
• When I package the app using Xcode 15.3 or above, the CSS styles do not display on iOS 17 or higher. However, on iOS 16.7.1, the CSS displays correctly.
• If I use Xcode 15.2 to package the app, the CSS loads and displays correctly on all iOS versions.
I am using WKURLSchemeHandler to intercept and load the local HTML files. Is there any known issue or workaround for this?
You can now post this in the “Safari & Web” section of the Apple Developer forums for further assistance!
//
// CustomURLSchemeHandler.m
// HTMLTest
//
// Created by lvxue on 2024/9/23.
//
// CustomURLSchemeHandler.m
#import "CustomURLSchemeHandler.h"
@implementation CustomURLSchemeHandler
// 拦截请求并提供本地 HTML 文件
- (void)webView:(WKWebView *)webView startURLSchemeTask:(id<WKURLSchemeTask>)urlSchemeTask {
NSURL *url = urlSchemeTask.request.URL;
//NSString *filePath;
// 获取本地 HTML 文件路径
NSString *filePath = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html" inDirectory:@"LoaclHtml.bundle/A4"];
// 判断请求的是 HTML、CSS 或其他文件
if ([url.lastPathComponent hasSuffix:@".css"]) {
filePath = [[NSBundle mainBundle] pathForResource:@"style" ofType:@"css" inDirectory:@"LoaclHtml.bundle/A4/css"];
} else if ([url.lastPathComponent hasSuffix:@".js"]) {
filePath = [[NSBundle mainBundle] pathForResource:@"yourJSFileName" ofType:@"js" inDirectory:@"LoaclHtml.bundle/A4/js"];
} // 可以继续添加其他资源类型如图片
NSData *htmlData = [NSData dataWithContentsOfFile:filePath];
NSString *mimeType = [self mimeTypeForPath:filePath];
// 创建响应头
NSURLResponse *response = [[NSURLResponse alloc] initWithURL:url
MIMEType:mimeType
expectedContentLength:htmlData.length
textEncodingName:@"utf-8"];
// 提供响应数据
[urlSchemeTask didReceiveResponse:response];
[urlSchemeTask didReceiveData:htmlData];
[urlSchemeTask didFinish];
}
// 停止请求
- (void)webView:(WKWebView *)webView stopURLSchemeTask:(id<WKURLSchemeTask>)urlSchemeTask {
// 通常不需要处理停止请求的逻辑
}
- (NSString *)mimeTypeForPath:(NSString *)path {
NSString *fileExtension = [path pathExtension];
if ([fileExtension isEqualToString:@"html"]) {
return @"text/html";
} else if ([fileExtension isEqualToString:@"css"]) {
return @"text/css";
} else if ([fileExtension isEqualToString:@"js"]) {
return @"application/javascript";
} else if ([fileExtension isEqualToString:@"png"]) {
return @"image/png";
} else if ([fileExtension isEqualToString:@"jpg"] || [fileExtension isEqualToString:@"jpeg"]) {
return @"image/jpeg";
} else if ([fileExtension isEqualToString:@"gif"]) {
return @"image/gif";
}
return @"application/octet-stream";
}
@end
code-block