本文使用webview框架AgentWeb
使用的Vue版本为vue3
使用的android sdk版本为33
从android 11 开始想要访问sd卡下的数据需要权限
android.permission.MANAGE_EXTERNAL_STORAGE
权限请求方法为
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.R && !Environment.isExternalStorageManager()) {
val requestPermission = Intent()
requestPermission.action = Settings.ACTION_MANAGE_ALL_FILES_ACCESS_PERMISSION
startActivity(requestPermission)
} else {
//todo 已有权限,正常操作
}
Vue调用Android
使用以下方法注册接口
//vue调用android方法使用window.关键字.方法名(参数)
//注册方法中,第一个参数为关键字,后一个参数为接口类实现,接口类时间见下方
agentWeb.jsInterfaceHolder.addJavaObject("关键字", AndroidJSInterface(agentWeb))
/**
* 接口类实现必须加 @JavascriptInterface 注解否则无法生效
* 如果vue调用android方法有回调目前测得返回String可以正常接收,返回实体会出现undefined情况
* vue中直接使用 let 返回值 = window.关键字.方法名(参数)接收返回值
*/
@JavascriptInterface
public String toast(String msg) {
//todo 需要的操作
return "";
}
Android调用Vue
根据Android与Vue的交互的方法示例这篇文章最后中提到的互调的坑中得知因为Vue的问题Android调用Vue方法需要在window中暴露方法名,所以我这边的设置如下:
/**
* 在mounted中暴露出需要被调用的方法名
*/
mounted(){
window['需要被Android调用的方法名'] = (方法参数)=>{
如果不需要返回则这边直接调用vue中自己的方法
如果存在返回值则在这边直接return 返回值,目前来看返回值类型使用String比较稳妥
}
},
android这边调用方式如下:
agentWeb.getJsAccessEntrace().callJs("javascript:方法名(参数)", new ValueCallback<String>() {
@Override
public void onReceiveValue(String s) {
//vue执行方法之后的返回值
//如果没有则可以不实现
}
});
以上就是目前能正常使用的Android与Vue的交互方式,Vue和Android WebView的版本变化可能导致本文方式无效。