iOS 自动适配的 WebView 封装

最新推荐文章于 2020-12-23 21:19:36 发布
最新推荐文章于 2020-12-23 21:19:36 发布
阅读量562 收藏
点赞数
文章标签： ui javascript 移动开发 ViewUI
原文链接：https://juejin.im/post/5a7abcff6fb9a063592bbc1d
版权

针对 iOS 不同版本下 WebView 的碎片化，进行整理封装，主要功能是根据系统版本自动选择 UI/WK-WebView 进行加载。

封装功能：

  • Block 方式 JavaScript <-> Objective-C 的交互。
  • 滑动至顶部功能
  • 扩展脚本
  • 针对 WKWebView 和 UIWebView 的 Cookie 等缓存互通
  • 内容渲染干预等
  • 新增特征：加入腾讯 VAS·Sonic 技术，一种声称可以秒开 WebView 的框架。

无需设置,无需插件,可创建基类继承管理全局WebView页面。

? 测试 UI 样式

1.列表页2.AutoWebView 加载页3.VAS·Sonic 加载页4.清除缓存页
通过 Main.storyboard 创建自动适配的 AutoWebView 框架腾讯的秒开 WebView 框架清除缓存操作

? 框架的优势

  • 1.文件少，代码简洁
  • 2.根据系统版本自动选择使用 UI/WK WebView，提升用户体验
  • 3.同时支持 WebView Delegate 系统回调和 WebViewJavascriptBridge 库回调
  • 4.结构架构优良，可通过基类集中管理加载页面
  • 5.具备较高自定义性

? 要求

  • iOS 7+
  • Xcode 8+

? 使用方法

1. RSAutoWebView 封装方法

1.1 对外方法
//使用UIWebView
- (instancetype)initWithFrame:(CGRect)frame usingUIWebView:(BOOL)usingUIWebView;

//会转接 WKUIDelegate，WKNavigationDelegate 内部未实现的回调。
@property (weak, nonatomic) id<RSAutoWebViewDelegate> delegate;

//内部使用的webView
@property (nonatomic, readonly) id realWebView;
//是否正在使用 UIWebView
@property (nonatomic, readonly) BOOL usingUIWebView;
//预估网页加载进度
@property (nonatomic, readonly) double estimatedProgress;

@property (nonatomic, readonly) NSURLRequest* originRequest;

//只有ios7以上的UIWebView才能获取到，WKWebView 请使用下面的方法.
@property (nonatomic, readonly) JSContext* jsContext;
//WKWebView 跟网页进行交互的方法。
- (void)addScriptMessageHandler:(id<WKScriptMessageHandler>)scriptMessageHandler name:(NSString*)name;

//back 层数
- (NSInteger)countOfHistory;
- (void)gobackWithStep:(NSInteger)step;

复制代码
1.2 内部方法
//---- UI 或者 WK 的API
@property (nonatomic, readonly) UIScrollView* scrollView;

- (id)loadRequest:(NSURLRequest*)request;
- (id)loadHTMLString:(NSString*)string baseURL:(NSURL*)baseURL;

@property (nonatomic, readonly, copy) NSString* title;
@property (nonatomic, readonly) NSURLRequest* currentRequest;
@property (nonatomic, readonly) NSURL* URL;

@property (nonatomic, readonly, getter=isLoading) BOOL loading;
@property (nonatomic, readonly) BOOL canGoBack;
@property (nonatomic, readonly) BOOL canGoForward;

- (id)goBack;
- (id)goForward;
- (id)reload;
- (id)reloadFromOrigin;
- (void)stopLoading;
// 清理缓存
- (void)clearCache;

- (void)evaluateJavaScript:(NSString*)javaScriptString completionHandler:(void (^)(id, NSError*))completionHandler;
// 不建议使用这个办法  因为会在内部等待webView 的执行结果
- (NSString*)stringByEvaluatingJavaScriptFromString:(NSString*)javaScriptString __deprecated_msg("Method deprecated. Use [evaluateJavaScript:completionHandler:]");

// 是否根据视图大小来缩放页面  默认为YES
@property (nonatomic) BOOL scalesPageToFit;

复制代码

2. BaseWebViewController 基类方法

2.1 基本方法
/* 
* url    请求地址
* isOpen 是否开启自动选择WebView功能
*        是: usingUIWebView 设置无效
*        否: usingUIWebView 设定是否使用 UIWebView
*/
- (void)loadWebViewWithURL:(NSString *)url autoChoose:(BOOL)isOpen ifCloseAutoChooseUsingUIWebView:(BOOL)usingUIWebView;
复制代码
2.2 增强方法
#pragma mark - 参数、方法
// URL地址
@property (nonatomic,copy) NSString *url;

// 加载URL方法
- (void)reloadRequest:(NSString *)url;

// 返回顶端
- (void)scrollToTop;

// 图片适应 JavaScript 注入
- (void)imgAutoFit;

// WebView中收起键盘方法
- (void)packupKeyboard;

// 返回方法
- (void)webViewBackAction:(UIBarButtonItem *)sender;

// 清理缓存
- (void)clearCache;

#pragma mark - 代理方法
/**
*  统一wk ui加载状态代理方法，二合一
*/
@property (nonatomic,copy) void(^startLoadBlock)(id webView);
@property (nonatomic,copy) void(^finishLoadBlock)(id webView);
@property (nonatomic,copy) void(^failLoadBlock)(id webView, NSError *error);

#pragma mark - WebViewJavascriptBridge JS交互方法
//callHandler【OC向JS发生消息】
- (void)JSCallHandlerWithFuncName:(NSString *)name Data:(NSDictionary *)dicData;
@property (nonatomic,copy) void(^javaScriptCallReturnBlock)(id response);

//registerHandler 【OC接收JS的消息】
- (void)JSRegisterHandlerWithFuncName:(NSString *)name;
@property (nonatomic,copy) void(^javaScriptRegisterReturnBlock)(id response, WVJBResponseCallback responseCallback);
复制代码

3. 腾讯 VAS·Sonic 秒开 WebView框架

3.1 简介

VasSonic 取名于索尼动画形象音速小子，是腾讯 QQ 会员 VAS 团队研发的一个轻量级的高性能的 Hybrid 框架，专注于提升页面首屏加载速度，完美支持静态直出页面和动态直出页面，兼容离线包等方案。目前 QQ 会员、QQ 购物、QQ 钱包、企鹅电竞等业务已经在使用，平均日均 PV 在 1.2 亿以上，并且这个数字还在快速增长。

接入 VasSonic 后首次打开可以在初始化 APP 的时候并行请求页面资源，并且具备边加载边渲染的能力。非首次打开时，APP 可以快速加载上次打开动态缓存在本地的页面资源，然后动态刷新页面。腾讯手机 QQ 通过 VasSonic 框架使得页面首屏耗时平均低于 1S 以下。

官方开源地址：github.com/Tencent/vas…

3.2 基本方法

引用头文件

// 腾讯VAS框架
#import "Sonic.h"
#import "SonicWebViewController.h"
#import "SonicOfflineCacheConnection.h"
复制代码

使用跳转方法

SonicWebViewController *webVC = [[SonicWebViewController alloc]initWithUrl:testTencentURL useSonicMode:YES];
webVC.title = @"VAS·Sonic";
[self.navigationController pushViewController:webVC animated:YES];
复制代码

使用简单、效率高效、进程安全~~~如果你有更好的建议,希望不吝赐教!

你的star是我持续更新的动力!

? CocoaPods更新日志

  • 2017.08.22(tag:0.9.0):
    1.整理基类开放方法，优化实现功能;
    2.加入腾讯开源的 VasSonic 秒开 WebView 框架。
  • 2017.04.10(tag:0.8.0):
    1.增加 WebViewJavascriptBridge 支持，增加JavaScript <-> Objective-C 交互;
    2.Block 方式回调封装;
    3.Cookie 缓存同步机制等。
  • 2016.09.18(tag:0.2.5):
    1.根据系统版本自动切换WK/UI-WebView,
    2.功能性封装。
  • 2016.08.26(tag:0.1.0):
    1.创建手动的 WebView 切换工具。

⚖ 许可证

RSAutoWebView 使用 MIT 许可证，详情见 LICENSE 文件。

? 联系方式:

EN

For different versions of iOS WebView fragmentation, sorting package, the main function is based on the system version automatically select UI / WK-WebView to load.

Package function:

  • Block Method JavaScript <-> Objective-C Interaction.

  • Swipe to the top function

  • Extended script

  • Cookies for WKWebView and UIWebView cache interoperability

  • Content rendering interventions

  • New Features: Join Tencent VAS · Sonic technology, a framework that claims WebView can be seconds off.

  • No need to set up, without plug-ins, to create a base class Inheritance Management Global WebView page. *

? What does the test UI look like?

1. List Page2.AutoWebView Load Page3.VAS · Sonic Load Page4. Clear Cache Page
Main.storyboardAuto-adapted AutoWebView FrameworkTencent's Seconds WebView FrameworkClear Cache Operations

? Advantage

    1. Less documents, code concise
    1. According to the system version automatically choose to use UI / WK WebView, enhance the user experience
    1. Support both WebView Delegate system callbacks and WebView JavaScriptBridge library callbacks
    1. The structure of the excellent structure, centralized management through the base class to load the page
    1. Have a higher custom

? Requirements

  • iOS 7+
  • Xcode 8+

? Usage Usage

1. RSAutoWebView wrapper method

1.1 Foreign methods
//Use UIWebView
- (instancetype)initWithFrame:(CGRect)frame usingUIWebView:(BOOL)usingUIWebView;

//Will be transferred WKUIDelegate, WKNavigationDelegate unimplemented callback.
@property (weak, nonatomic) id<RSAutoWebViewDelegate> delegate;

//Internal use of webView
@property (nonatomic, readonly) id realWebView;
//Whether you are using UIWebView
@property (nonatomic, readonly) BOOL usingUIWebView;
//Estimate the progress of webpage loading
@property (nonatomic, readonly) double estimatedProgress;

@property (nonatomic, readonly) NSURLRequest* originRequest;

//Only ios7 above UIWebView can be obtained, WKWebView use the following method.
@property (nonatomic, readonly) JSContext* jsContext;
//WKWebView way to interact with the web page.
- (void)addScriptMessageHandler:(id<WKScriptMessageHandler>)scriptMessageHandler name:(NSString*)name;

//back layer
- (NSInteger)countOfHistory;
- (void)gobackWithStep:(NSInteger)step;

复制代码
1.2 internal methods
//---- UI or WK API
@property (nonatomic, readonly) UIScrollView* scrollView;

- (id)loadRequest:(NSURLRequest*)request;
- (id)loadHTMLString:(NSString*)string baseURL:(NSURL*)baseURL;

@property (nonatomic, readonly, copy) NSString* title;
@property (nonatomic, readonly) NSURLRequest* currentRequest;
@property (nonatomic, readonly) NSURL* URL;

@property (nonatomic, readonly, getter=isLoading) BOOL loading;
@property (nonatomic, readonly) BOOL canGoBack;
@property (nonatomic, readonly) BOOL canGoForward;

- (id)goBack;
- (id)goForward;
- (id)reload;
- (id)reloadFromOrigin;
- (void)stopLoading;
// Clean up the cache
- (void)clearCache;

- (void)evaluateJavaScript:(NSString*)javaScriptString completionHandler:(void (^)(id, NSError*))completionHandler;
// It is not recommended to use this method because it will wait for the execution of the webView internally
- (NSString*)stringByEvaluatingJavaScriptFromString:(NSString*)javaScriptString __deprecated_msg("Method deprecated. Use [evaluateJavaScript:completionHandler:]");

// Whether to scale the page by view size defaults to YES
@property (nonatomic) BOOL scalesPageToFit;

复制代码

2. BaseWebViewController base class method

2.1 The basic method
/ *
* url request address
* isOpen Whether to enable automatic selection of WebView features
* Is: usingUIWebView setting is invalid
* No: usingUIWebView set whether to use UIWebView
* /
- (void)loadWebViewWithURL:(NSString *)url autoChoose:(BOOL)isOpen ifCloseAutoChooseUsingUIWebView:(BOOL)usingUIWebView;
复制代码
2.2 Enhance the method
#pragma mark - Parameters, methods
// URL address
@property (nonatomic,copy) NSString *url;

// Load URL method
- (void)reloadRequest:(NSString *)url;

// Back to top
- (void)scrollToTop;

// Image adapted to JavaScript injection
- (void)imgAutoFit;

// Collapse the keyboard method in WebView
- (void)packupKeyboard;

// Return method
- (void)webViewBackAction:(UIBarButtonItem *)sender;

// Clean up the cache
- (void)clearCache;


#pragma mark - Proxy method
/**
*  Unified wk ui loading state proxy method, combo
*/
@property (nonatomic,copy) void(^startLoadBlock)(id webView);
@property (nonatomic,copy) void(^finishLoadBlock)(id webView);
@property (nonatomic,copy) void(^failLoadBlock)(id webView, NSError *error);

#pragma mark - WebViewJavascriptBridge JS interaction method
// callHandler [OC news to JS]
- (void)JSCallHandlerWithFuncName:(NSString *)name Data:(NSDictionary *)dicData;
@property (nonatomic,copy) void(^javaScriptCallReturnBlock)(id response);

// registerHandler [OC receive JS news]
- (void)JSRegisterHandlerWithFuncName:(NSString *)name;
@property (nonatomic,copy) void(^javaScriptRegisterReturnBlock)(id response, WVJBResponseCallback responseCallback);
复制代码

3. Tencent VAS · Sonic seconds to open the WebView framework

3.1 Introduction

VasSonic named after the Sony animated image sound speed kid, is Tencent QQ membership VAS team developed a lightweight high-performance Hybrid framework, focusing on improving the first page of the page loading speed, the perfect support for static straight out of the page and the dynamic straight out of the page, Compatible with offline packages and other programs. Currently QQ members, QQ shopping, QQ wallet, penguins and other businesses have been using e-sports, the average daily PV in more than 120 million, and this number is still rapidly growing.

The first time you access VasSonic, you can request the page resources in parallel while initializing your app and have the ability to load side-edges. When not opening for the first time, the app can quickly load the last time the page resource was dynamically cached in the local page, and then dynamically refresh the page. Tencent mobile QQ through the VasSonic framework makes the first page of the screen consumes less than 1S average time below.

Official open source address: github.com/Tencent/vas…

3.2 The basic method

Quote the header file

// Tencent VAS framework
#import "Sonic.h"
#import "SonicWebViewController.h"
#import "SonicOfflineCacheConnection.h"
复制代码

Use the jump method

SonicWebViewController *webVC = [[SonicWebViewController alloc]initWithUrl:testTencentURL useSonicMode:YES];
webVC.title = @"VAS·Sonic";
[self.navigationController pushViewController:webVC animated:YES];
复制代码

Simple to use, efficient, process-safe ~~~ If you have better suggestions, I hope have enlighten me!

Your star is my motivation to keep updating!

? CocoaPods update log

  • ** 2017.08.22 (tag: 0.9.0): ** </ br>
  1. Sort open base class method, optimize the realization of the function; </ br>
  2. Join Tencent open source VasSonic second open WebView framework. </ br>
  • ** 2017.04.10 (tag: 0.8.0): ** </ br>
  1. Add WebViewJavascriptBridge support, add JavaScript <-> Objective-C interaction; </ br> 2.Block callback package; </ br> 3.Cookie cache synchronization mechanism. </ br>
  • ** 2016.09.18 (tag: 0.2.5): ** </ br>
    1. Automatically switch WK / UI-WebView by system version, </ br> 2 functional package. </ br>
  • ** 2016.08.26 (tag: 0.1.0): ** </ br>
    1. Create a manual WebView switch tool. </ br>

⚖ License License

RSAutoWebView uses a MIT license, as detailed in the LICENSE file.

? Contact :

weixin_34354945
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
iOS 封装WebView 控制器
iOS逆向与安全
03-15 3615
文章目录引言I 、用法II、封装AXWebViewController 引言 效果图 依赖AXWebViewController pod 'AXWebViewController' I 、用法 - (void)setup_goto_WebView{ NSString * url = k_API_tao_index; url = [NSString stringWithFormat:@"%@%@",[[NSUserDefaults standa
iOS WebView 图片点击放大并左右滑动,类似微信/网易文章功能
刘祺旭的技术博客
09-14 4273
好久没有来CSDN写文章了,上一次估计都时隔一年多了. *前言:事情起因是有小伙伴问我能不能实现原生加载任意网页(不需要H5工程师支持)都可以实现类似微信公众号那种图片点击放大,还能左右滑动的功能?我说:这东西网上肯定有实现吧,你百度看看就好了.结果他一会回来说,网上的都太老了,逻辑也不清楚,只有简单的当前图片放大,而且想用新的WKWebView来实现,毕竟UIWebView太老旧了. 于是我寻
ios-WKWebView 一些简单封装.zip
07-11
1. 加载网页, 实时显示网页加载进度 2. 支持手动刷新功能 /** 是否可以刷新 */ @property (nonatomic, assign) BOOL canRefresh; 3. 支持 iOS8.0 以上
ios-封装UIWebVIew和WKWebView优化webview性能.zip
07-11
ZLCWebView github:https://github.com/lczhai/ZLCWebView //若有帮助，帮点下star 将UIWebVIew和WKWebView封装到一起，当系统版本大于8.0时候选择WKWebView降低性能消耗，当小于8.0时候使用UIWebView进行加载 1、将项目中的根目录中的“ZLCWebView源文件”中的ZLCWebView.h及m拖入工程（或直接在项目中拖出） 2、在自己的目标视图加载即可 //在目标视图内初始化ZLCWebView ZLCWebView *my = [[ZLCWebView alloc]initWithFrame:self.view.bounds]; [my loadURLString:@"http://www.baidu.com"]; my.delegate = self; [self.view addSubview:my]; //让视图遵守ZLCWebView的delegate并实现ZLCWebView的delegate - (void)zlcwebViewDidStartLoad:(ZLCWebView *)webview { NSLog(@"页面开始加载"); } - (void)zlcwebView:(ZLCWebView *)webview shouldStartLoadWithURL:(NSURL *)URL { NSLog(@"截取到URL：%@",URL); } - (void)zlcwebView:(ZLCWebView *)webview didFinishLoadingURL:(NSURL *)URL { NSLog(@"页面加载完成"); } - (void)zlcwebView:(ZLCWebView *)webview didFailToLoadURL:(NSURL *)URL error:(NSError *)error { NSLog(@"加载出现错误"); }
iOS基于WKWebView的二次封装webview.zip
09-25
iOS基于WKWebView的二次封装webview。.zip,iOS基于WKWebView的二次封装，功能丰富
【IOS开发】WKWebView封装APP
cbbing的专栏
08-09 4084
一年多没接触xcode了，这一年主要用python做开发，刹一接触xcode代码，还是有点陌生的感觉。在网上闲逛了一通，发现网上的ios教程用swift编写的比oc的多多了。看来苹果的swift推广的比较好。我偶尔写写简单的app，objective-c用过一段时间，这次还是用oc，swift等有时间了好好研究一下。 前段时间有朋友让做一个ipad程序，用webview封装一个网站，实现一个独立的
一个webview封装的图表组件基于百度echarts3
08-10
【标题】"一个webview封装的图表组件基于百度echarts3"揭示了这个项目的核心是将ECharts 3，一个流行的JavaScript数据可视化库，集成到React Native应用中。ECharts是由百度开发的一个开源项目，提供了丰富的图表...
ReactNative的自动高度webview_JavaScript_下载.zip
04-22
`react-native-autoheight-webview-master`这个压缩包文件很可能包含了一个已经封装好的ReactNative组件，该组件专门用于实现Webview的自动高度功能。通常，这样的组件会包含以下关键部分： 1. **Webview组件**：这...
iOS 原生加载微信支付链接跳转支付宝方法封装
07-09
本篇文章将详细讲解如何在iOS原生环境中封装这个功能，特别是在使用WKWebView时可能会遇到的问题和解决方案。 1. **WKWebView介绍** WKWebView是Apple在iOS 8中引入的一个高级Web视图组件，用于取代UIWebView。...
swift-一劳永逸iOS网页视图控制器通用类封装
08-15
"swift-一劳永逸iOS网页视图控制器通用类封装"项目就是针对这一需求，提供了一个通用的WebViewController类，旨在简化开发者的工作，提高代码复用性。 这个项目的核心是创建一个自定义的`SureWebViewController`，...
针对WKWebView进行的封装 iOS
04-06
作者1xlsd，源码SDWebView，针对WKWebView进行的封装、支持和H5交互、通过属性获取cookie、H5图片预览、包括调用js方法等。挺全面的！真的。其他针对WKWebView封装的就不要看了。
WKWebView的封装
07-17
WKWebView的封装
UIWebVIew和WKWebView封装到一起
04-05
作者lczhai，源码ZLCWebView，将UIWebVIew和WKWebView封装到一起，当系统版本大于8.0时候选择WKWebView降低性能消耗，当小于8.0时候使用UIWebView进行加载 1、将项目中的根目录中的“ZLCWebView源文件”中的ZLCWebView.h及m拖入工程（或直接在项目中拖出） 2、在项目Targets ->build Phases ->link Binary With Libraries 中添加WebKit.framework（否则Deployment Target调整成7.0时,运行程序就会报错） 3、在自己的目标视图加载即可
iOS开发中WebView的基本使用方法简介
01-04
1、使用UIWebView加载网页 运行XCode 4.3，新建一个Single View Application，命名为WebViewDemo。 2、加载WebView 在ViewController.h添加WebView成员变量和在ViewController.m添加实现 代码如下: #import @interface ViewController : UIViewController {     UIWebView *webView; } @end ViewController.m – (void)viewDidLoad {     [super
苹果网址一键免签绿标打包工具1.0.0.zip
09-04
苹果网址一键免签绿标打包工具，可以把网址打包成苹果APP，无需签名，无需苹果硬件和任何开发环境，可以直接在Windows上安装操作，软件为共享免费版，每日都有打包次数
iOS WKWebView带进度条封装（只用传入url，可改变进度条颜色）
walkerwqp的博客
04-19 779
1 NSTimer+addition.h   #import &lt;Foundation/Foundation.h&gt;   @interface NSTimer (addition)   /** 暂停时间 */ - (void)w_pauseTime; /** 获取内容所在当前时间 */ - (void)w_webPageTime; /** 当前时间 time 秒后的时...
iOS 基于javascriptcore封装的 webviewjavascritpbridge
u011993697的专栏
06-03 1405
1.javascriptcore介绍webkit的组成部分，对js进行解析和提供执行环境。苹果在ios7后推出的oc和javascript互相调用的开源库。 以前ios调用oc 用stringByEvaluatingJavaScriptFromString JS调用oc，是基于url进行拦截 代表开源库：webviewjavascriptbridge 使用javascriptcore 能够提
ioswebview混编_iOS WebView内容的适配
weixin_42511507的博客
12-23 269
在开发过程中很多时候为了节约时间成本嵌套一些H5页面，页面的内容有的在H5代码里做过适配有的没做过，这就造成了有些页面在移动设备上走形。下面说一下工程中遇到的一个问题：页面文字适应而图片没有适应，页面显示为文字在屏幕宽度之内而图片保留了网页端的大小，使webView横向容量非常大。。。解决方式是调用JS语言，调整一下其中图片的高度，这个时机可以选择在webView的代理方法里，代码如下- (voi...
对iOS的UIWebView的封装，实现与html5的交互
一步一迹的博客
02-18 4040
近期做了个项目里面需要加载网页，里面要求点击网页然后ios可以响应，点击ios的界面可以调用html5的代 码。为了实现这个要求，并且尽量做到代码的复用就自己实现了个类继承自UIWebView。 首先我是采用javaScroptCore这个系统库实现原生和html5交互的。并且写了个协议用来进行类跟类间的通
ios react native webview
最新发布
11-09
iOS React Native WebView 是 React Native 框架中用于展示 Web 内容的组件。它可以在 iOS 上运行，并且提供了一种在应用中嵌入 Web 页面的方式。 使用 iOS React Native WebView 可以实现以下功能： 1. 显示 Web ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值