All Projects → xiubojin → Jxbwkwebview

xiubojin / Jxbwkwebview

Licence: mit
An component WebView for iOS base on WKWebView

Projects that are alternatives of or similar to Jxbwkwebview

Mybrowser
我的浏览器,基于WKWebView实现的一个iOS浏览器,实现了无图模式、广告拦截、多窗口、扫描二维码、收藏夹/历史、无痕浏览、夜间模式等功能...
Stars: ✭ 127 (-80.34%)
Mutual labels:  webview, wkwebview
Flutter inappwebview
A Flutter plugin that allows you to add an inline webview, to use a headless webview, and to open an in-app browser window.
Stars: ✭ 1,259 (+94.89%)
Mutual labels:  webview, wkwebview
VHLWebView
微信/支付宝样式的网络浏览器控件。WKwebview 封装,js bridge和拦截url方式两种方法实现 oc和js交互
Stars: ✭ 14 (-97.83%)
Mutual labels:  webview, wkwebview
Flutter browser app
A Full-Featured Mobile Browser App (such as the Google Chrome mobile browser) created using Flutter and the features offered by the flutter_inappwebview plugin.
Stars: ✭ 85 (-86.84%)
Mutual labels:  webview, wkwebview
Lcwebview
www.strictfrog.com
Stars: ✭ 144 (-77.71%)
Mutual labels:  webview, wkwebview
QuickWebKit
A great & strong plugin based WebViewController. 一款基于插件的 WebView 视图控制器,您可以基于它设计您的浏览器插件,然后像积木一样来组装它们。
Stars: ✭ 29 (-95.51%)
Mutual labels:  webview, wkwebview
React Native Wkwebview
WKWebview Component for React Native
Stars: ✭ 622 (-3.72%)
Mutual labels:  webview, wkwebview
Android Smartwebview
A webview integrated w/ native features to help create most advanced hybrid applications.
Stars: ✭ 357 (-44.74%)
Mutual labels:  webview
Aachartcore
📈📊☕️☕️☕️An elegant modern declarative data visualization chart framework for Android. Extremely powerful, supports line, spline, area, areaspline, column, bar, pie, scatter, angular gauges, arearange, areasplinerange, columnrange, bubble, box plot, error bars, funnel, waterfall and polar chart types.极其精美而又强大的 Android 数据可视化图表框架,支持柱状图、条形图、折线图、曲线图、折线填充图、曲线填充图、气泡图、扇形图、环形图、散点图、雷达图、混合图等各种类型的多达几十种的信息图图表,完全满足工作所需.
Stars: ✭ 424 (-34.37%)
Mutual labels:  webview
Customactionwebview
自定义webview长按文本弹出选项,并且点击后返回选项与所选中的文本,你的webview不再只支持系统的复制等功能了,长按web文本实现文本一键收藏、分享,就是这么简单。Demo中附带对webView的详细使用:api详解,配置详解,js多种通信方式详解。
Stars: ✭ 338 (-47.68%)
Mutual labels:  webview
Androidfastscroll
Fast scroll for Android RecyclerView and more
Stars: ✭ 316 (-51.08%)
Mutual labels:  webview
Wkwebview
WKWebView的使用、JS和OC的交互、网页内容加载进度条的实现、WKWebView+UITableView混排 、 WKWebView离线缓存
Stars: ✭ 366 (-43.34%)
Mutual labels:  wkwebview
Smartyoutubetv
Watch YouTube videos on your TV and set-top-box with comfort
Stars: ✭ 4,384 (+578.64%)
Mutual labels:  webview
Electron Tabs
Simple tabs for Electron applications
Stars: ✭ 350 (-45.82%)
Mutual labels:  webview
Cloudreader
🗡️ 云阅:一款基于网易云音乐UI,使用玩Android Api,Retrofit2 + RxJava2 + Room + MVVM-databinding架构开发的Android客户端
Stars: ✭ 4,611 (+613.78%)
Mutual labels:  webview
Aachartcore Kotlin
📈📊⛰⛰⛰An elegant modern declarative data visualization chart framework for Android . Extremely powerful, supports line, spline, area, areaspline, column, bar, pie, scatter, angular gauges, arearange, areasplinerange, columnrange, bubble, box plot, error bars, funnel, waterfall and polar chart types.极其精美而又强大的 Android 数据可视化图表框架,支持柱状图、条形图、折线图、曲线图、折线填充图、曲线填充图、气泡图、扇形图、环形图、散点图、雷达图、混合图等各种类型的多达几十种的信息图图表,完全满足工作所需.
Stars: ✭ 332 (-48.61%)
Mutual labels:  webview
Jsbridge
A simpler, extendable bidirectional communication Frame between Android WebView and Javascript
Stars: ✭ 612 (-5.26%)
Mutual labels:  webview
Kkjsbridge
一站式解决 WKWebView 支持离线包,Ajax/Fetch 请求,表单请求和 Cookie 同步的问题 (基于 Ajax Hook,Fetch Hook 和 Cookie Hook)
Stars: ✭ 462 (-28.48%)
Mutual labels:  wkwebview
Imgresize
移动端H5图片压缩
Stars: ✭ 391 (-39.47%)
Mutual labels:  webview
React Native Autoheight Webview
An auto height webview for React Native
Stars: ✭ 385 (-40.4%)
Mutual labels:  webview

如果你有好的想法,欢迎Issue或贡献代码!

如果你在使用该库的过程中遇到任何问题,可以通过我的邮箱或Issue联系到我。

使用CocoaPods安装

pod 'JXBWebKit', '~> 1.3.0'

手动安装

拖动JXBWebKit文件夹到你的项目.

注意Copy选项需要选择"Copy items into destination group's folder" and select "Create groups for any folders".

示例

打开JXBWebKitProject直接执行项目。

使用方法

1.可以直接使用JXBWebViewController实例对象打开远程和本地的HTML.

2.可以从JXBWebViewController派生出一个子类,使用该子类实例打开远程和本地的HTML.

3.还可以从JXBWKWebViewPool获取一个可复用的WebView,使用该WebView打开远程和本地的HTML.

提供的功能

1.WebView适配不通机型.

2.UI支持(进度条、进度条颜色、back&close按钮).

3.支持拦截URL.

4.通过JSBridgeWeb进行交互,实测任何场景的交互操作都可满足!比如

  • 打开naive任意页面.
  • 获取native定位、推送、相册、相机等权限.
  • 获取native数据。
  • 调用native的任意API
  • 其他

5.对子类提供WebView父类的hook操作.

6.支持WKWebView的复用,通过复用优化启动性能以及内存占用.

7.支持各种自定义浏览器的UserAgent.

8.支持拦截WebView的网络请求.

9.支持操作Cookie.

10.demo中提供了让业务H5页面秒开的方案(HTML模板渲染 & 静态资源离线包).

  • 现在市面上绝大部分新闻类APP使用的都是HTML模板渲染方案.
  • 除了资讯类页面外其他业务场景的H5都可使用离线包方案.

注意

关于上述第10条中提到的H5秒开方案需要server进行配合,因此在这里我使用Go语言进行后台开发,server提供了两个API

1.一个普通的get请求,client通过获取响应数据中的html渲染模板进行渲染。

2.一个下载服务器离线包资源的接口。

当然,要想看这个功能的具体实现效果,需要在本地配置Go的开发环境,详见如下步骤:

1.使用brew install go安装golang.

2.环境配置

(1)使用cd ~切换到根目录.

(2)使用ls -all查看所有文件,看有没有.bash_profile文件.

(3)没有就创建一个touch .bash_profile

使用vim打开.bash_profile进行编辑,i进行编辑,编辑完成后:wq退出,编辑内容如下:

export GOPATH=/Users/<your name>/Documents/go
export GOBIN=$GOPATH/bin
export PATH=$PATH:$GOBIN

(4)切换到Documents文件夹,创建go文件夹,再在go文件夹下分别创建binsrc文件夹,src就是以后存放项目的文件夹.

(5)在终端输入go env命令查看配置是否正确,GOBIN有值表示配置没问题.

(6)在本工程内搜索文件夹GoProject > src > OfflineServer,将OfflineServer文件夹拷贝至Documents > go > src目录下.

(7)切换至Documents > go > src

(8)go build编译项目.

(9)go run main.go运行项目.

(10)不再需要开启server服务可以control+c退出.

整体架构

image

关于JSBridge的实现原理

图解

image

JS调用Native

示例代码大家可以通过两种方式获取到,如下:

(1)找到当前工程目录,再找到GoProject -> src -> OfflineServer -> source,在source文件下有个压缩文件offline_pkg.zip,将该文件拷贝至别处解压,找到resource目录下的offline.js文件,里面就有示例代码,比如:

获取native的推送权限状态

function getPushAuthState() {
    window.JXBJSBridge.call({
           target : "push",
           action : "getAuthorityState",
           data : { 
             "id" : "123456789",
             "name" : "zhangsan"
           },
           callback : {
              success : function(result){document.getElementById('message').innerHTML = result;},
              fail : function(result){document.getElementById('message').innerHTML = result;},
              progress : function(result){document.getElementById('message').innerHTML = result;},
           }
	});
}

(2)在当前工程目录下有个JSResources.bundle文件,显示包内容,里面有个index.html,同样也有示例代码。

Object-C代码如何写?

JS约定好参数,target、action、data、callback等。

target:对应原生的目标类,格式为Service_target

action:对应目标类的目标方法,格式为func_action:

dataJS传给Native的数据。

callbackNative处理完业务后回调给JS的结果。

示例:

//获取推送权限状态
- (void)func_getAuthorityState:(NSDictionary *)param {
    //获取id
    NSString *ID = param[@"id"];
    //获取name
    NSString *name = param[@"name"];
    
    BOOL isOpen = NO;
    UIUserNotificationSettings *setting = [[UIApplication sharedApplication] currentUserNotificationSettings];
    if (setting.types != UIUserNotificationTypeNone) {
        isOpen = YES;
    }
    void(^successCallback)(NSDictionary *result) = param[@"success"];
    NSDictionary *resultDict = @{@"isOpen":@(isOpen)};
    successCallback(resultDict);
}

如何与Android统一调用方式

当前库加载的注入脚本是JXBJSBridge.js,当WebView加载HTML时会在window上挂一个call方法,此时call方法相当于一个全局方法,供JS调用,这个脚本文件同样可以提供给Android使用,达到调用方式统一的目的。

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].