将本地图像加载到WKWebView中 [英] Loading local images into WKWebView
问题描述
我正在尝试让WKWebView在 WKWebView 中显示本地下载的图像。 webview通常显示HTML，可以远程检索。 HTML的内容有时可能包含指向图像的远程链接。我的应用程序解析HTML并查找这些HTML标记，下载它引用的文件，然后用本地文件替换远程链接。
I'm trying to get WKWebView to display locally downloaded images in a WKWebView. The webview normally displays HTML, which is retrieved remotely. The contents of the HTML can sometimes contain remote links to images. My app parses the HTML and looks for these HTML tags, downloads the file it is referencing and subsequently replaces the remote link with a local one.
通常情况下，这不会很困难，但图像没有显示，可能是因为webview的图像和本地HTML文件是两个单独的目录（文档目录和应用程序包目录）。
我见过人们建议将图像的下载目的地移动到与HTML文件相同的目录，但这不是我的选择，因为我不想开始混合下载的文件拥有本地资产的用户。
Normally speaking, this wouldn't be very difficult but the images aren't being displayed, presumably due to the images and the local HTML files for the webview being in two separate directories (the documents directory and the app bundle directory respectively). I've seen people suggest moving the download destination of the images to the same directory as where the HTML files are but this isn't an option for me as I don't want to start mixing up files downloaded by the user with local assets.
这里我最好的做法是什么？
What would be my best course of action here?
推荐答案
在 WKWebView 中显示缓存的HTML引用缓存资源：
To display cached HTML referencing cached resources in a WKWebView:
-
对于HTML内容字符串中的每个资源，将其缓存到
NSTemporaryDirectory（）提供的目录中。所以像这样的图像标签：
For each of the resources within your HTML content string, cache it into the directory as provided by
NSTemporaryDirectory(). So an image tag like:
...< img src ='https：//www.myimage.com/example_image.png' /> ...
应缓存并替换为以下内容：
should be cached and replaced into something like this:
...< img src ='/ private / var / mobile / Containers / Data / Application / 527CF4FC-9319-4DFF-AB55-9E276890F5DC / tmp / example_image.png'/> ...
现在使用替换的资源URL缓存HTML内容字符串。它还必须缓存在 NSTemporaryDirectory（）提供的目录中。这里的一个区别是必须使用 file：// 协议缓存（以后引用）作为使用 NSData <缓存字符串的限制/ code>（参见示例代码）。
Now cache the HTML content string with the replaced resource URLs. It must also be cached in the directory provided by NSTemporaryDirectory(). One difference here is that it must be cached (and later referenced) using the file:// protocol as a restriction of caching the string using NSData (see sample code).
例如 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中无效。
- You cannot load the HTML as a raw string (
loadHTMLString:baseURL:). - You cannot reference the cached resource within your HTML string using the
file://protocol. That may work in aUIWebView, but will not work in theWKWebView.
Objective-C
Objective-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)
Swift
// 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)
这篇关于将本地图像加载到WKWebView中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
