JsBridge & Android WebView
JsBridge & Android WebView
webview
loadUrl
addJavascriptInterface
.setJavaScriptEnabled(true);
findViewById
注解
@JavascriptInterface
https://developer.android.com/reference/android/webkit/WebView.html
getSettings
https://developer.android.com/reference/android/webkit/WebView.html#getSettings
https://developer.android.com/reference/android/webkit/WebSettings
new
class JsObject {
@JavascriptInterface
public String toString() { return "injectedObject"; }
}
webview.getSettings().setJavaScriptEnabled(true);
webView.addJavascriptInterface(new JsObject(), "injectedObject");
webView.loadData("", "text/html", null);
webView.loadUrl("javascript:alert(injectedObject.toString())");
https://developer.chrome.com/multidevice/webview/overview
https://developer.chrome.com/multidevice/webview/gettingstarted
old
webSettings.setJavaScriptEnabled(true);
demos
https://www.journaldev.com/9333/android-webview-example-tutorial
Android WebView 与 js 交互 JsBridge
Android
http://www.imooc.com/learn/983
public class MainActivity extends AppCompatActivity{
private WebView webView;
private TextView textView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initWidgets(savedInstanceState);
}
private void initWidgets(Bundle savedInstanceState) {
webView = findViewById(R.id.webview);
textView = findViewById(R.id.textview);
// WebView 开启对 js 加载的支持
webView.getSettings().setJavaScriptEnabled(true);
}
}
- webview
public class MainActivity extends AppCompatActivity{
private WebView webView;
private TextView textView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initWidgets(savedInstanceState);
}
private void initWidgets(Bundle savedInstanceState) {
webView = findViewById(R.id.webview);
textView = findViewById(R.id.textview);
// WebView 开启对 js 加载的支持
webView.getSettings().setJavaScriptEnabled(true);
// WebView 上添加 js 方法的接口实现类
webView.addJavascriptInterface(new jsMethodsObjectInterface(), "jsMethodsObjectName"n)
}
}
- js interface
public class JsMethodsObjectInterface{
private static final String TAG = "JsMethodsObjectInterface";
@JavascriptInterface
public void setInputValue(String value){
Log.d(TAG, msg: "input value =" + value);
}
}
JSbridge 通信原理
jsbridge android
https://github.com/lzyzsd/JsBridge
https://juejin.im/entry/5c5c40cb518825790c5aecd8
https://www.codeproject.com/Tips/1063403/WebView-JS-Bridge-Android
https://www.jianshu.com/p/2ec3f06d6087
https://juejin.im/post/5ac044a8518825557459d603
https://zhuanlan.zhihu.com/p/38046261
refs
JsBridge
原生开发可以访问平台所有功能,而混合开发中,H5 代码是运行在 WebView 中,
而 WebView 实质上就是一个浏览器内核,其 JavaScript 依然运行在一个权限受限的沙箱中,
所以对于大多数系统能力都没有访问权限,如无法访问文件系统、不能使用蓝牙等。
所以,对于 H5 不能实现的功能,都需要原生去做。
而混合框架一般都会在原生代码中预先实现一些访问系统能力的 API, 然后暴露给 WebView 以供 JavaScript调用;
这样一来,WebView 就成为了 JavaScript与原生 API之间通信的桥梁,主要负责 JavaScript与原生之间传递调用消息;
而消息的传递必须遵守一个标准的协议,它规定了消息的格式与含义,我们把依赖于 WebView 的用于在 JavaScript与原生之间通信并实现了某种消息传输协议的工具称之为 WebView JavaScript Bridge, 简称 JsBridge,它也是混合开发框架的核心。
WebView Scheme / URL Scheme
https://book.flutterchina.club/chapter1/mobile_development_intro.html
refs
xgqfrms 2012-2020
www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!
最新文章
- 消息队列性能对比——ActiveMQ、RabbitMQ与ZeroMQ(译文)
- vertical-align浅析
- JAVA过滤器
- Bash 为何要发明 shopt 命令
- Windows 7专业版安装VS2005与WinCE6.0开发环境
- SQLServer中给表增加组合唯一约束
- Windwos服务器远程桌面不能复制粘贴的解决方法
- [Bootstrap]组件(三)
- 图论(四)------非负权有向图的单源最短路径问题,Dijkstra算法
- build/envsetup.sh内lunch解析
- 浏览器缓存相关http头
- nginx配置限制同一个ip的访问频率
- Linux shell中的竖线(|)——…
- PostgreSql问题:ERROR: column ";1"; does not exist
- .NET Core实战项目之CMS 第十六章 用户登录及验证码功能实现
- .net core webapi 将localhost改成ip地址
- python——数字问题之_ 变量
- JS性能优化 之 文档片段 createDocumentFragment
- jsp中使用原生js实现异步交互
- 郑晔谈 Java 开发:新工具、新框架、新思维【转载】【整理】