Android 关于Tencent vConsole 添加入webView 总结

官方地址:

https://github.com/Tencent/vConsole/blob/dev/doc/tutorial_CN.md

上面文档中提供了两种常见的引入H5工程思路,简单易懂!

今天这篇文章要说明的是,不同于官方文档的接入方式。

先说背景:H5工程方,因框架原因不愿意或者不方便引入,这样就导致问题定位模糊,容易产生相互推诿的情况,那么作为app 客户端的我们又该如何应对呢?

思路:了解官方文档明白,本质就是引入一段js代码。那么为何不通过webView 直接注入。

不考虑兼容性的情况下(4.4以下),通过webVIew.evaluateJavascript的方法就可实现注入js。

实践1:网络cdn 引用 注入。

代码如下:

String injectScript = "(function() {" +

"function loadVConsole() {" +

" if (!window.vConsoleLoaded) {" +

" var script = document.createElement('script');" +

" script.type = 'text/javascript';" +

" script.src = 'https://unpkg.com/vconsole/dist/vconsole.min.js';" +

" script.onload = function() {" +

" window.vConsoleLoaded = true;" +

" if (window.vConsoleLoaded && window.vConsoleInstance == null) {" +

" window.vConsoleInstance = new VConsole();" +

" }" +

" };" +

" document.head.appendChild(script);" +

" }" +

"}" +

"loadVConsole();" + // 调用函数来加载VConsole

"})();";

binding.dwebVIew.evaluateJavascript(injectScript, null);

至此vConsole 就可以使用了。

然后又突发奇想,如果放到本地会不会更快?

所以出现了

实践2:本地assets 文件中的js引用 注入。

try {

if(TextUtils.isEmpty(vConsoleScript)) {

// 读取assets文件夹中的vconsole.min.js文件

InputStream inputStream = getAssets().open("jsbrg/vconsole.min.js");

int size = inputStream.available();

byte[] buffer = new byte[size];

inputStream.read(buffer);

inputStream.close();

vConsoleScript = new String(buffer, "UTF-8");

}

// 构造注入到WebView中的JavaScript代码

if(TextUtils.isEmpty(injectScript)) {

injectScript = "(function() {" +

"function loadVConsole() {" +

" if (!window.vConsoleLoaded) {" +

" var script = document.createElement('script');" +

" script.type = 'text/javascript';" +

" script.textContent = '" + escapeJavaScriptString(vConsoleScript) + "';" +

" document.head.appendChild(script);" +

" window.vConsoleLoaded = true;" +

" if (window.vConsoleLoaded && !window.vConsoleInstance) {" +

" window.vConsoleInstance = new VConsole();" +

" }" +

" }" +

"}" +

"loadVConsole();" +

"})();";

}

// 注入JavaScript代码到WebView中

binding.dwebVIew.evaluateJavascript(injectScript, null);

} catch (IOException e) {

e.printStackTrace();

}

其中遇到两个坑:

1、从assets文件夹中读取,注意路径一定得有,否则会io异常

2、上述方法有个关键方法,字符转义方法,加载的字符串无法直接注入,所以没这个方法无法注入成功,如下:

public static String escapeJavaScriptString(String input) {

if (input == null || input.isEmpty()) {

return "";

}

StringBuilder sb = new StringBuilder(input.length());

for (int i = 0; i < input.length(); i++) {

char c = input.charAt(i);

switch © {

case '\':

sb.append("\\");

break;

case ''':

sb.append("\'");

break;

case '"':

sb.append("\"");

break;

case '

':

sb.append("\r");

break;

case '

':

sb.append("

");

break;

case ' ':

sb.append("\f");

break;

case '':

sb.append("\b");

break;

case ' ':

sb.append("\t");

break;

// 对于其他需要转义的字符,如 <, >, &, 也可以在这里添加

// 但通常这些字符在 JavaScript 字符串中不需要转义,除非它们被嵌入到 HTML 中

default:

// 对于 ASCII 范围内的字符,通常不需要转义

// 但对于非打印字符或特殊 Unicode 字符,你可能需要添加额外的逻辑

if ((c >= 0x20 && c <= 0x7E) || Character.isISOControl©) {

sb.append©;

} else {

sb.append©;

}

}

}

return sb.toString();

}

以上就是两种不同官方添加vConsole的方法,本质都是通过安卓 webView的动态注入js方法。

实践2:确实更快一些,个人感觉!免去了网络延时,多了本地处理时间,大家可以对比一下

看到最后,恭喜你获得,踩坑经历大礼包:

注入的时机选择:

1、onPageFinished

2、onPageStarted

3、onProgressChanged

经过我的实践:我这边认为最好的注入时机,这个三个地方都加上,onProgressChanged 方法中进度超过35%时开始注入。由于在注入代码中有添加是否注入过的逻辑,所以不用担心重复注入。

onPageStarted 这里添加是为了能尽可能的快注入成功,可能尽可能多的获取日志。

onPageFinished 这里添加是,前两处注入都失败了,有个保底方案。

看到这里,缺点也非常明显,日志是否能打印全,取决于注入成功的时间。所以会损失部分初始日志,但我测试也是偶发情况。

到此分享结束,我也是迫于无奈才出此下策,有更好的办法,欢迎分享。最后的最后希望大家不会用到这种方法,尽量让前端同学自己添加

相关推荐
Crossoads1 小时前
【汇编语言】端口 —— 「从端口到时间:一文了解CMOS RAM与汇编指令的交汇」
android·java·汇编·深度学习·网络协议·机器学习·汇编语言
li_liuliu2 小时前
Android4.4 在系统中添加自己的System Service
android
C4rpeDime4 小时前
自建MD5解密平台-续
android
鲤籽鲲6 小时前
C# Random 随机数 全面解析
android·java·c#
m0_5485147710 小时前
2024.12.10——攻防世界Web_php_include
android·前端·php
凤邪摩羯10 小时前
Android-性能优化-03-启动优化-启动耗时
android
凤邪摩羯10 小时前
Android-性能优化-02-内存优化-LeakCanary原理解析
android
喀什酱豆腐11 小时前
Handle
android
m0_7482329212 小时前
Android Https和WebView
android·网络协议·https
m0_7482517212 小时前
Android webview 打开本地H5项目(Cocos游戏以及Unity游戏)
android·游戏·unity