如何从 webview 使用 UIImagePickerController

Question

我正在在线关注本教程https://makeapppie.com/2016/06/28/how-to-use-uiimagepickercontroller-for-a-camera-and-photo-library-in-swift-3-0/（有点扭曲）。我正在尝试从网络视图中调用我的UIImagePickerController，但我不确定如何更改代码以使其正常工作。不同之处在于我将收到来自 javascript 的调用，然后调用选择器而不是使用 UIButton。然后我想使用我的 javascript 界面将图像作为 base64 字符串发回。

这是我目前所拥有的。

import UIKit
import WebKit

class ViewController: UIViewController,
                        WKScriptMessageHandler,
                        UIImagePickerControllerDelegate,
                        UINavigationControllerDelegate {


    var webView: WKWebView?
    let userContentController = WKUserContentController()
    let picker = UIImagePickerController();

    @IBAction func photoFromLibrary(_ sender: UIBarButtonItem) {
        picker.allowsEditing = false
        picker.sourceType = .photoLibrary
        picker.mediaTypes = UIImagePickerController.availableMediaTypes(for: .photoLibrary)!
        present(picker, animated: true, completion: nil)
    }


    override func loadView() {
        super.loadView()


        let config = WKWebViewConfiguration()
        config.userContentController = userContentController

        self.webView = WKWebView(frame: self.view.bounds, configuration: config)
        userContentController.add(self, name: "iOS")

        let url = URL(string:"https://relate.lavishweb.com/account")
        let request = URLRequest(url: url!)
        _ = webView?.load(request)

        self.view = self.webView



    }

    override func viewDidLoad() {
        super.viewDidLoad()
        picker.delegate = self
    }


    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {

        webView?.evaluateJavaScript("window.settings.setImageBase64FromiOS()") { (result, error) in
            if error != nil {
                print("Success")
            } else {
                print("Failure")
            }
        }


        // now use the name and token as you see fit!
    }

    func imagePickerController(_ picker: UIImagePickerController,
                               didFinishPickingMediaWithInfo info: [String : AnyObject])
    {
        let chosenImage = info[UIImagePickerControllerOriginalImage] as! UIImage //2
        //        myImageView.contentMode = .scaleAspectFit //3
        //        myImageView.image = chosenImage //4

        //I want to do additional stuff here and send back as a base64 String
        dismiss(animated:true, completion: nil) //5

    }
    func imagePickerControllerDidCancel(_ picker: UIImagePickerController) {
        dismiss(animated: true, completion: nil)
    }
}

Answer 1

嗨，我有同样的问题，一个 ein 解决了它，但它有点脏。 在 viewDidLoad() 中，您覆盖了 WKWebView 中的委托。 WKWebView 也使用委托。您需要将 Delegate 保存在本地。

var oldDelegate: UIImagePickerControllerDelegate?

override func viewDidLoad() {
    super.viewDidLoad()
    oldDelegate = picker.delegate   // save the Delegate from WKWebView
    picker.delegate = self
}

现在您可以在您的委托中运行您的代码。在您的方法 imagePickerController() 结束时，您必须从旧委托调用 imagePickerController()。

func imagePickerController(_ picker: UIImagePickerController,
                               didFinishPickingMediaWithInfo info: [String : AnyObject]){
        var myinfo = info
        let chosenImage = info[UIImagePickerControllerOriginalImage] as! UIImage //2
        //        myImageView.contentMode = .scaleAspectFit //3
        //        myImageView.image = chosenImage //4
        myinfo[UIImagePickerControllerOriginalImage] = chosenImage
        myinfo[UIImagePickerControllerImageURL] = nil

        oldDelegate?.imagePickerController!(picker, didFinishPickingMediaWithInfo: myinfo)
    }

我将 URL 设置为 nil，因为如果 URL 已填充，WKWebView 会直接从驱动器加载图像。 myinfo[UIImagePickerControllerImageURL] = 无

我希望这会有所帮助。

Answer 2

好吧，我想通了，

所以我不知道 IBAction 是什么，但基本上这意味着我要在它之后声明的函数是由界面生成器元素调用的东西，例如 UIButton 或类似的东西。意识到这一点后，我只是将功能更改为

func photoFromLibrary() {
    picker.allowsEditing = false
    picker.sourceType = .photoLibrary
    picker.mediaTypes = UIImagePickerController.availableMediaTypes(for: .photoLibrary)!
    present(picker, animated: true, completion: nil)
}

然后在我的 JavaScript 界面中，当我收到来自 JavaScript 的调用时，我只是调用了该函数。

func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {

    webView?.evaluateJavaScript("window.settings.setImageBase64FromiOS()") { (result, error) in
        if error != nil {
            print("failure")
        } else {
            self.photoFromLibrary()
        }
    }
}

敬请期待，我将发布如何将图像编码为 Base64 字符串，同时在加载时将其缩小。（当然，一旦我知道如何做到这一点）

编辑：我想出了如何快速调整图像大小并转换为 Base64 字符串。

我实现了这个扩展...

extension UIImage {
    func resized(withPercentage percentage: CGFloat) -> UIImage? {
        let canvasSize = CGSize(width: size.width * percentage, height: size.height * percentage)
        UIGraphicsBeginImageContextWithOptions(canvasSize, false, scale)
        defer { UIGraphicsEndImageContext() }
        draw(in: CGRect(origin: .zero, size: canvasSize))
        return UIGraphicsGetImageFromCurrentImageContext()
    }
    func resized(toWidth width: CGFloat) -> UIImage? {
        let canvasSize = CGSize(width: width, height: CGFloat(ceil(width/size.width * size.height)))
        UIGraphicsBeginImageContextWithOptions(canvasSize, false, scale)
        defer { UIGraphicsEndImageContext() }
        draw(in: CGRect(origin: .zero, size: canvasSize))
        return UIGraphicsGetImageFromCurrentImageContext()
    }
}

然后我像这样返回字符串......

func imagePickerController(_ picker: UIImagePickerController,
                           didFinishPickingMediaWithInfo info: [String : AnyObject])
{
    let chosenImage = info[UIImagePickerControllerOriginalImage] as! UIImage 
    let thumb = chosenImage.resized(toWidth: 72.0)
    let imageData:NSData = UIImagePNGRepresentation(thumb!)! as NSData
    let dataImage = imageData.base64EncodedString(options: .lineLength64Characters)
    print(dataImage)
    dismiss(animated:true, completion: nil) //5

}