用WKWebview方法在evaluateJavascript上设置局部图像
我有一个HTML文件，其中包含本地资源文件，如css，js文件的内容。这些本地资源文件采用zip格式。我的应用程序使用WKWebView显示这个html文件。我正在尝试在WKWebview上的html图像元素中上传一个图像，该元素是本地保存的，并且html不使用该图像进行更新。我在本地html中有一个html图像标记，如下所示。
<img id='image' style='display: block; height: 100%; width:100%; margin:0 auto;' />要加载到此图像标记中的图像是在本地html文件加载到WKWebview中之后生成的。一旦生成了图像，我就会尝试使用这样的计算javascript方法来更新图像标记。
NSString *js = @"document.getElementById('image').src='document directory/Library/images/generatedImage.png';"
[self.wkWebView evaluateJavaScript:js completionHandler:nil];我是不是做错什么了。我还读到，我们不能在本地更新图像，这是2年前的情况，仍然一样吗？对于我的场景有什么解决方案吗？提前谢谢。
回答 2
Stack Overflow用户
发布于 2020-08-17 18:46:07
我可以想出两种方法来做你想做的事。
- 自定义URL方案
- 将图像转换为base64，然后通过评估Javascript将其设置
自定义URL方案
iOS Version 11支持这一点，如果您支持的版本低于11，那么使用第二种方法会更好。其基本思想是使用定制协议(如my- that :// your )来提及您的URL，然后拦截该路径并提供对WKWebView的响应。在这种情况下，您必须创建一个扩展WKSchemeHandler的类，并重写它所需的方法。例如：
import WebKit
import Foundation
class CustomeSchemeHandler : NSObject,WKURLSchemeHandler {
func webView(_ webView: WKWebView, start urlSchemeTask: WKURLSchemeTask) {
}
func webView(_ webView: WKWebView, stop urlSchemeTask: WKURLSchemeTask) {
}
}在start方法中，可以从所需的源加载内容，然后通过
urlSchemeTask.didReceive(response)
urlSchemeTask.didReceive(data)
urlSchemeTask.didFinish()实现逻辑之后，需要通过WKWebView通过*forURLScheme计划：)注册它。
看到上面的内容后，您可以在自定义方案中提到图像URL，并将工作留给您的CustomSchemeHandler处理。
这种方法非常成熟，从长远来看是非常有帮助的。我找到了一篇非常好的和简短的文章，详细介绍了实现，请查看它：b/custom-scheme-handling-in-uiwebview-wkwebview-bbeb2f3f6cc1
将图像转换为base64，然后通过评估Javascript来设置它
- 从您的路径创建UIImage，例如https://stackoverflow.com/a/43006566/2299040
- 将图像转换为base64
- 获取HTML元素的Id并加载base64字符串
例如：
if let image = UIImage(contentsOfFile: ""){
//Now use image to create into NSData format
if let imageData = image.jpegData(compressionQuality: 0.8){
let strBase64 = imageData.base64EncodedString(options: .lineLength64Characters)
webView.evaluateJavaScript("document.getElementById('your-image-element-id').setAttribute('src', '\(strBase64)');")
}
}Stack Overflow用户
发布于 2020-08-12 08:17:07
对于您的示例，我可以通过将URL设置为src从internet加载图像。
我想您可能还没有在加载webview时给予对本地图像文件目录的读取访问权限。
利用wkwebview的loadFileURL方法通过授予对特定目录的访问权限来加载HTML文件
EG (在Swift中)，
let imgDir = "<your image directory>"
let imgDirUrl = URL(fileURLWithPath: String(format: "%@", imgDir), isDirectory: true)
webView.loadFileURL(<your HTML file URL path>, allowingReadAccessTo: imgDirUrl)(用objc)
NSString *imgDir = "<your image directory>"
NSURL *imgDirUrl = [NSURL fileURLWithPath:[NSString stringWithFormat:@"%@",imgDir] isDirectory:true];
[webView loadFileURL:<your HTML file URL path> allowingReadAccessToURL:imgDirUrl];https://stackoverflow.com/questions/63191025
复制相似问题
腾讯云开发者
