Question

我正在尝试让WKWebView在WKWebView中显示本地下载的图像。 webview通常显示HTML，可以远程检索。 HTML的内容有时可能包含指向图像的远程链接。我的应用程序解析HTML并查找这些HTML标记，下载它引用的文件，然后用本地文件替换远程链接。

通常情况下，这并不是很困难，但图像没有显示，可能是因为webview的图像和本地HTML文件分别位于两个单独的目录（文档目录和应用程序包目录）中）。我见过有人建议将图像的下载目的地移动到与HTML文件相同的目录，但这对我来说不是一个选项，因为我不想开始将用户下载的文件与本地资产混合在一起

这是我最好的行动方案？

Answer 1

好吧，我找到了解决方法。我现在不是在本地存储图像并在HTML文件中引用它们，而是将图像转换为Base64，然后将它们添加到HTML中。它并不理想，但它完成了工作。如果有人设法找到实际的解决方案，我会打开这个问题。

Answer 2

我为所工作的公司开发了最终解决方案。但是它依赖于html / javascript端。您应该在HTML代码中引用本地图像<img src="..."/>的任何位置动态设置此"src"，它将无缝运行。

function getLocalURL(path) {
    let origin = window.location.origin
    if (origin == "file://") {
        return origin + window.location.pathname.replace("/index.html","") + path
    }
    return path
}

您应该清楚地将index.html重命名为您的主要.htm（l）文件名：）

用法：

getLocalURL("/local_images/location_icon.png")

将为引用的本地图像路径返回WKWebView工作路径：

"file:///Users/arthurdapaz/Library/Developer/CoreSimulator/Devices/5073AF19-26A0-460E-BC82-E89100B8E1AB/data/Containers/Data/Application/2B099343-0BF5-4849-B1C2-2512377A9772/Documents/distDriver/local_images/location_icon.png"

Answer 3

在WKWebView：

中显示缓存的HTML引用缓存资源

对于HTML内容字符串中的每个资源，将其缓存到NSTemporaryDirectory()提供的目录中。所以像这样的图像标签：

...<img src='https://www.myimage.com/example_image.png'/>...
应该缓存
并将其替换为以下内容：

...<img src='/private/var/mobile/Containers/Data/Application/527CF4FC-9319-4DFF-AB55-9E276890F5DC/tmp/example_image.png'/>...
现在使用替换的资源URL缓存HTML内容字符串。它还必须缓存在NSTemporaryDirectory()提供的目录中。这里的一个区别是它必须使用file://协议缓存（以后引用）作为使用NSData缓存字符串的限制（参见示例代码）。

例如file:///private/var/mobile/Containers/Data/Application/527CF4FC-9319-4DFF-AB55-9E276890F5DC/tmp/my_html_content_string.html

要指出的一些事项：

您无法将HTML加载为原始字符串（loadHTMLString:baseURL:）。
您无法使用file://协议在HTML字符串中引用缓存资源。这可能适用于UIWebView，但不适用于WKWebView。

目标-C

// To cache the HTML string:
NSString *HTML = <HTML CONTENT WITH CACHED RESOURCES>;
NSData *data = [HTML dataUsingEncoding: NSUTF8StringEncoding];
[data writeToURL: cachedHTMLURL atomically: YES];

// To load the store HTML file:
[myWKWebView loadRequest: [NSURLRequest requestWithURL: cachedHTMLURL]]; // (file://.../tmp/my_html_content_string.html)

夫特

// To cache the HTML string:
let HTML = <HTML CONTENT WITH CACHED RESOURCES>
let data = HTML.data(using: String.Encoding.utf8)
do {
    try data.write(to: cachedHTMLURL, options: .atomic)
} catch {
    print(error)
}

// To load the store HTML file:
myWKWebView.load(URLRequest(url: cachedHTMLURL)) // (file://.../tmp/my_html_content_string.html)

Answer 4

我对WKWebView遇到了同样的问题，因为出于安全目的，它不能同时加载html字符串和图像。我切换到了不推荐使用的UIWebView，但是我能够同时加载html字符串和引用的图像。

将本地图像加载到WKWebView中

4 个答案: