WebView使用中的一些心得

最近在做一个一个项目,Android通过WebView加载H5链接,达到混合开发的目的。其中也遇到了一些有趣的问题,主要分为三点:

1.webview加载的时候,一些属性的设置。

2.Android和H5端进行数据的交互。

3.通过weview全屏播放视频。

一,webview属性设置:

图1-webview属性

图1就是这些属性的设置,其中比较重要的就是setJavaScriptEnabled(true),这个属性是设置webview允许执行js脚本。

图中红线圈着的属性是是否开启本地DOM存储,这个是为了解决weview加载的时候白屏或者显示一直加载中问题而设置的(知识点啊,亲)。

二,Android和H5的数据交互

首先,我们先说一下功能,点击H5界面在Android本地实现第三方登录, 这分为两个过程,一是点击h5界面跳向第三方登录界面,二是登录成功后把登录信息返回给h5界面。前者是H5调用Android代码,后者是Android调用H5的代码。

(1)H5调用Android

我们这里使用的是通过WebView的addJavascriptInterface()进行对象映射,首先我们新建一个用于传递的对象LoginAndroidtoJS

我们在这个实体类里写下让h5端可以调用的方法,注意,我们要写上@JavascriptInterface注解,这样h5端才能拿到这个方法。为了更加方便的实现功能,我把h5调用的方法回调到Activity里,下面是Activity实现的代码:


addJavaScriptInterface()方法,第一个参数是我们android端的要传的对象,第二个是传到JS端,他们可以使用的对象。

在这里提醒一点,这里对象的引用只能用一个,我曾经在回调和传对象的时候都是new LoginAndroidtoJS(),然后回调失效。(这是我犯的错误,大家引以为戒)

以上是我们android端的代码,JS端要想调用这个方法,其实很简单,只需要在第三方登录图标的点击事件里写下:test.jump();  

(2)Android调用h5

登录成功后,android端获取用户信息,然后把它传给H5;

核心代码就是mWebView.loadUrl("javascript:showInfoFromJava('" + msg +"')");showInfoFromJava是js端定义的方法。

这里的实现参考了这篇文章https://www.jianshu.com/p/e8cafd11ead9,十分感谢。

现在我们说一下js端的实现,我们首先要在methods定义这个方法

methods:{

showInfoFromJava(msg){}

}

然后在mounted方法里初始化

mounted:{

window.showInfoFromJava=this.showInfoFromJava

}

播放视频全屏的下一篇再讲。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 221,695评论 6 515
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 94,569评论 3 399
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 168,130评论 0 360
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 59,648评论 1 297
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 68,655评论 6 397
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 52,268评论 1 309
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,835评论 3 421
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,740评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 46,286评论 1 318
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 38,375评论 3 340
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,505评论 1 352
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 36,185评论 5 350
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,873评论 3 333
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,357评论 0 24
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,466评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,921评论 3 376
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,515评论 2 359

推荐阅读更多精彩内容

  • 用两张图告诉你,为什么你的 App 会卡顿? - Android - 掘金 Cover 有什么料? 从这篇文章中你...
    hw1212阅读 12,744评论 2 59
  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,111评论 1 32
  • 江嶺 到江嶺去,就是为了看油菜花。阳春三月,正是江嶺油菜花盛開之時。每到此時,慕名而來的遊客絡繹不...
    Jack老顽童阅读 401评论 0 0
  • 前几日在公司做了一个有关知识管理的内部分享,现将分享的核心内容整理如下,分享给大家,希望能对大家有所帮助。 1. ...
    GuangHui阅读 817评论 0 2
  • 乾县有七十二条半巷子,记忆中大多是靠两条腿来完成两点间的位移,如要长距离的跨越则要去两个车站,一个是地运司...
    Lemon_df88阅读 373评论 0 7