获取UIWebView中图片原始数据(不用二次下载)

400 阅读1分钟

最近实现了这样的一个需求:点击webView中的图片,进入图片预览的模式。为了避免图片的重复下载,需要直接显示网页中已经下好的图片。

因为是webview里面的图片,所以就想到从javascript入手去获取webView里面的图片.

function getImgDataWithID(imgID){
      var img = document.getElementById("img");
       var c = document.createElement("canvas");
       c.width = img.width;
       c.height = img.height;
       var ctx=c.getContext("2d");
       ctx.drawImage(img,0,0,img.width,img.height);
       var result = c.toDataURL("image/png");
       return result;
}
         

这样就获取到了图片本身的数据,其中c.toDataURL("image/png");这句话是把canvas里面的图片数据提取出来并转化成base64的格式。

但是这种方法有2个缺陷:

  1. 就是无法拉取跨域的图片。 如果是加载本地的html到UIWebView的话,跨域问题是不会出现的,在网站上用这个方法的话就不行了。
  2. 图片的base64过程是比较消耗性能的。js这边有方法可以获取到图片的原始数据
var imageData = context.getImageData(0,0,img.width,img.height); 

但是,暂时没有找到方法把这种数据传到iOS这边。

iOS这边实现的代码如下

let jsString = webView.stringByEvaluatingJavaScriptFromString("getImgDataWithID(\"imgID\");")
if let data = NSData(base64EncodedString: sub) {
    return UIImage(data: data)
}