从HTMLWKWebView下载图像 [英] Download Image from HTML WKWebView

问题描述

下面是我从WKWebView中加载的URL获得的标记之一

<；img id="Image_id"name="ImageName"src="captcha.jpg">

在DidFinish上是否可以将该图像作为UIImage获取？

推荐答案

为此，我使用了一些库来提供帮助。

在使用Pod(或Carthage或您喜欢的任何东西)的项目中插入下列库：

SwiftSoup

AlamofireImage

一旦您的项目设置了这些库，我们就可以开始了。

在您的故事板中，放置2个元素，在我的故事板中我有一个WKWebView，下面有一个ImageView。 只需设置约束，以确保测试时所有内容都会显示在屏幕上。😇

然后在代码中我们将拥有：

import UIKit
import WebKit
import SwiftSoup
import AlamofireImage


class ViewController: UIViewController, WKNavigationDelegate {
    @IBOutlet weak var webView: WKWebView!
    @IBOutlet weak var imageView: UIImageView!

    let url = URL(string: "https://www.google.com")
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        webView.navigationDelegate = self

        let urlReq = URLRequest(url: url!, cachePolicy: .reloadIgnoringLocalCacheData, timeoutInterval: 1)
        webView!.load(urlReq)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
        webView.evaluateJavaScript("document.documentElement.outerHTML.toString()",
                                   completionHandler: { (html: Any?, error: Error?) in
                                    do{
                                        let doc: Document = try SwiftSoup.parse(html as! String)
                                        let pngs: Elements = try doc.select("img[src$=.png]")
                                        let srcsStringArray: [String?] = pngs.array().map { try? $0.attr("src").description }
                                        for imgs in srcsStringArray {
                                            if let imgUrl = imgs {
                                                var finalUrl = URL(string: "")
                                                if imgUrl.contains("http") {
                                                    finalUrl = URL(string: String(format: imgUrl))
                                                } else {
                                                    finalUrl = URL(string: String(format: "%@%@", (self.url?.absoluteString)!, imgUrl))
                                                }
                                                self.imageView.af_setImage(withURL: finalUrl!)
                                                print(finalUrl) //debug URL
                                            }
                                        }
                                    } catch Exception.Error(let type, let message){
                                        print(type, message)
                                    } catch {
                                        print("error")
                                    }
        })
    }
}

此示例按原样运行。

当然，您需要根据您的需要调整它，但您拥有这样做的所有元素。

编辑1：

我只有一个图像，如果您有多个图像，您必须在行上正确处理它：

for imgs in srcsStringArray {...}

编辑2：

验证码已就绪，正在获取准确加载的映像。 在这种情况下，您不需要AlamoFire或SwiftSoup

import UIKit
import WebKit

class ViewController: UIViewController, WKNavigationDelegate {
    @IBOutlet weak var webView: WKWebView!
    @IBOutlet weak var imageView: UIImageView!

    let url = URL(string: "YOUR_URL")

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        webView.navigationDelegate = self

        let urlReq = URLRequest(url: url!, cachePolicy: .reloadIgnoringLocalCacheData, timeoutInterval: 1)
        webView!.load(urlReq)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {

        let str = "var c = document.createElement('canvas'); var ctx = c.getContext('2d'); ctx.drawImage(document.getElementById('captcha_id'), 100, 40); var value = c.toDataURL(); value.split(',')[1]; "

        self.webView.evaluateJavaScript(str) { (value, error) in
             if error == nil {
                 if let img = value as? String {
                      self.imageView.image = self.base64ToImage(base64: img)
                 }
             }
         }
    }

    func base64ToImage(base64: String) -> UIImage? {
        var img: UIImage = UIImage()
        if (!base64.isEmpty) {
            if let decodedData = NSData(base64Encoded: base64 , options: NSData.Base64DecodingOptions.ignoreUnknownCharacters) {
                if let decodedimage = UIImage(data: decodedData as Data) {
                    img = (decodedimage as UIImage?)!
                    return img
                }
            }
        }
        return nil
    }
}

这篇关于从HTMLWKWebView下载图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！