Skip to content
/ SDWebView Public

针对WKWebView进行的封装、支持和H5交互、通过属性获取cookie、H5图片预览、包括调用js方法,以及WKWebview图片预览、WKWebView图片浏览、预览、图片保存等功能,Base on the WKWebView,this lib support handle javaScript, web photo browse and on.

License

Notifications You must be signed in to change notification settings

xlsd/SDWebView

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

94 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Demo中包含两个组件,SDWebView 和 PhotoBrowser。

   SDWebView组件 是针对WKWebView进行的深度封装、支持和H5交互、包括调用js方法等。挺全面的,有不当之处,请多指教,微信:xue-zhi-yin-you-ni。 PhotoBrowser组件 是早些时候我从耀源项目YYKit中抽离出来的图片浏览器,并做了类的重命名,防止和项目中继承YYKit的同学发生文件冲突,比我写的好用,就干脆移植过来,创建简单易用,可以复制demo中的代码。 demo是使用SDWebView加载的图片页面,然后使用PhotoBrowser组件进行图片预览,需要用到WKWebView中图片预览的这个demo就在合适不过了!

image

功能支持

   一.支持H5页面图片预览    二.支持H5调用OC  OC调用H5    三.更多!!!

//给webView添加监听title和进度条
[self.webView addObserver:self forKeyPath:@"title" options:NSKeyValueObservingOptionNew context:nil];
[self.webView addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];

//kvo监听进度条
- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSKeyValueChangeKey,id> *)change context:(void *)context {
    if ([object isKindOfClass:[SDWebView class]]) {
        if ([keyPath isEqualToString:@"estimatedProgress"]) {
            CGFloat newprogress = [[change objectForKey:NSKeyValueChangeNewKey] doubleValue];
            if (newprogress == 1) {
                self.webView.progressView.hidden = YES;
                [self.webView.progressView setProgress:0 animated:NO];
            }else {
                self.webView.progressView.hidden = NO;
                [self.webView.progressView setProgress:newprogress animated:YES];
            }
        }
        if ([keyPath isEqualToString:@"title"]) {
            if (self.webView.title.length > 10) {
                self.navigationItem.title = [self.webView.title substringToIndex:14];
            } else {
                self.navigationItem.title = self.webView.title;
            }
        }
    } else {
        [super observeValueForKeyPath:keyPath ofObject:object change:change context:context];
    }
}
//移除监听
[self.webView removeObserver:self forKeyPath:@"estimatedProgress"];
[self.webView removeObserver:self forKeyPath:@"title"];


//js调OC时,需要让前端人员写如下js代码   
                              //👇 AppModel是我们所注入的对象   也就是SDWebView的jsHandlers
window.webkit.messageHandlers.AppModel.postMessage({body: response});

//对象可以注入多个,所以jsHandlers是个数组  如下代码:注入三个对象到页面中
self.webView.jsHandlers = @[TOLOGIN,TOPAY,TOYATI];

//如果注入了对象 要调用如下方法,注销handle 不然会creash
[self.webView removejsHandlers];


//OC调用js时,可以调用如下方法:
- (void)callJS:(nonnull NSString *)jsMethodName;

//可能使用的属性及方法如下:


/**
 需要加载的urlStr
 */
@property (nonatomic, copy) NSString *URLString;

/**
 web页面中的图片链接数组
 */
@property (nonatomic, strong) NSMutableArray *imgSrcArray;

/**
 进度条
 */
@property (strong, nonatomic) UIProgressView *progressView;

/**
 webView的标题、如果navigationItemTitle需要和webView保持一致、直接getter方法即可
 */
@property (nonatomic, copy) NSString *webViewtitle;

/**
 注入H5页面的交互模型
 */
@property (nonatomic, strong) NSArray<NSString *> *jsHandlers;

/**
 获取交互的参数代理
 */
@property (nonatomic, weak) id<SDWebViewDelegate> delegate;

/**
 根据URL初始化
 @param urlString URLString
 @return WebviewVc实例
 */
- (instancetype)initWithURLString:(NSString *)urlString;

/**
 *  加载本地HTML页面
 *
 *  @param htmlName html页面文件名称
 */
- (void)loadLocalHTMLWithFileName:(nonnull NSString *)htmlName;

/**
 移除jsHandler
 */
- (void)removejsHandlers;

/**
 清除所有cookie
 */
- (void)removeCookies;

/**
 清除指定域名中的cookie
 
 @param cookieName 域名
 */
- (void)removeCookieWithHostName:(NSString *)hostName;

/**
 *  调用JS方法(无返回值)
 *
 *  @param jsMethod JS方法名称
 */
- (void)callJS:(nonnull NSString *)jsMethodName;

/**
 *  调用JS方法(可处理返回值)
 *
 *  @param jsMethod JS方法名称
 *  @param handler  回调block
 */
- (void)callJavaScript:(nonnull NSString *)jsMethodName handler:(nullable void(^)(__nullable id response))handler;

//如果前端人员不知道OC调用js 的方法怎么写 可参考如下代码 ↓
function configer() {
    reture {'c':"100"}
}
在callJS方法中直接让前端人员返回一个json 或者 其他返回值 OC即可在handler这个blcok 中获取 这个返回值
Support Cocopods: pod 'SDWebView'

特别说明

SDWebView中注入的js只对部分H5页面有效,如果当前的H5页面中的图片是在iframe中引用的另外一个URL中的图片,那么SDWebView是不支持的,请自行参考交互代码和前端人员指定交互方式,特此说明。

About

针对WKWebView进行的封装、支持和H5交互、通过属性获取cookie、H5图片预览、包括调用js方法,以及WKWebview图片预览、WKWebView图片浏览、预览、图片保存等功能,Base on the WKWebView,this lib support handle javaScript, web photo browse and on.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages