心得技巧
html5HTML/XhtmlCSSXML/XSLTDreamweaver教程Frontpage教程心得技巧

android与H5数据交互(kotlin)

发布时间：2022-07-01 发布网站：脚本宝典
脚本宝典收集整理的这篇文章主要介绍了android与H5数据交互(kotlin)，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

前言

最近老项目重构 纯原生项目换成了原生+h5 混合开发 所有的功能基本都由H5做了 andROId这边只负责调用硬件设备 拿到硬件返回的数据 再返回H5 交由他来加载显示

android与H5数据交互(kotlin)@H_777_10@

主要方法有2个

一是H5输入内容传给android android接受到保存数据库 这样做的好处是 即使重新加载H5 数据还是有的 不会丢失重要信息

另一个方法就是H5调用android的方法 由android返回数据给H5显示

效果图

android与H5数据交互(kotlin)

HtML代码

直接全部copy html的代码 然后新建一个.hmtl 文件 名字无所谓 只要和代码里的保持一致就ok

android与H5数据交互(kotlin)

<html XMlns="http://www.w3.org/1999/xhtml" debug="true">
<head>
    <;meta http-equiv="Content-tyPE" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="width=device-width, inITial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport" content="target-densitydpi=device-dpi"/>
    <script type="text/javascript">
    function init()
               {
               VAR testVal = document.getElementById('mytextId').value;
               android.setexport(testVal);
           }

    function getExport(){
         var testVal = document.getElementById('getExport');
         var str = window.android.getExport();
         testVal.innerHTML=str
         }

    function getID(){
         var testVal = document.getElementById('getID');
         var str = window.android.getID();
         testVal.innerHTML=str
         }

    </script>
</head>
<body>
<div style="float: left;width: 100%;margin-top: 6%;margin-left: 6%">
    <input type="text" style="width: 50%;height: 4vh;font-Size: 2vh"
           name="myText" id="mytextId"/>

</div>
<div style="clear: both;height: 3px;"></div>

<p id="getExport"></p>

<p id="getID"></p>
<div style="float: left;width: 100%;margin-top: 6%;margin-left: 6%">
    <input value="submit" type="button" name="submit"
           style="width: 50%;height: 4vh;font-size: 2vh"
           id="BTnSubmit" onclick="javascript:return init();"/>
</div>
<div style="float: left;width: 100%;margin-top: 6%;margin-left: 6%">
  <button style="width: 50%;height: 4vh;font-size: 2vh" onclick="getExport()">点击调用本地方法</button>

</div>
<div style="float: left;width: 100%;margin-top: 6%;margin-left: 6%">
  <button style="width: 50%;height: 4vh;font-size: 2vh" onclick="getID()">获取身份证</button>

</div>



</body>
</html>

android端

这里有几个关键注意的点 就是H5和android端约定好的方法名和校验的KEY也可以说是TAG webView?.addJavascriptInterface(JavaScriptInterface(this), "android") 这里的android就是约定的key JavaScriptInterface这个是内部类 来实现返回数据和接收数据的方法

android与H5数据交互(kotlin)

		//webView的基本配置
        val webSettings = webView?.settings
        webSettings?.javaScriptEnabled = true
        webSettings?.javaScriptCanOpenWindowsAutomatically = true
        webSettings?.setSupportZoom(true)
        webSettings?.builtInZoomControls = true
        webSettings?.useWideViewPort = true
        webSettings?.loadWithOverviewMode = true
        webSettings?.setAppCacheEnabled(true)
        webSettings?.domStorageEnabled = true
        webSettings?.loadsImagesAutomatically = true
        webSettings?.mediaplaybackRequireSUSErGesture = false


        webView?.loadUrl("file:///android_asset/js.html")//本地测试

        //h5调用kotlin
        webView?.addJavascriptInterface(JavaScriptInterface(this), "android")


        /*设置不用系统浏览器打开 用当前webView*/
        webView?.webViewClient = object : WebViewClient() {
            override fun shouldOverrideUrlLoading(view: WebView, url: String): Boolean {
                view.loadUrl(url)
                return true
            }
        }


        /*允许ssl证书*/
        webView?.webViewClient = object : WebViewClient() {
            override fun onReceivedSslError(
                webview: WebView?,
                handler: SslErrorHandler?,
                ssl: SslError?
            ) {
                handler?.PRoceed()
            }
        }

JavaScriptInterface

这个类setExport方法是H5端调用给我数据 我这里拿到数据会保存本地数据库room

android与H5数据交互(kotlin)

这个类getExport方法是从我这里（android）端获取数据(数据是我从room数据库取出来)

android与H5数据交互(kotlin)

 class JavaScriptInterface internal constructor(context: Context) {
        var mContext: Context = context
        var IDCardDevice: publicSecurityIDCardLib? = null
        private val bitmapFileSize = ByteArray(38556)
        var pkName: String? = null
        var userName: String? = null
        var userSex: String? = null
        var userID: String? = null
        var address: String? = null
        var faceId: String? = null
        private var combineParams: String? = null
        val map: MutableMap<String, String> = HashMap()

        @JavascriptInterface
        fun setExport(webMessage: String): Int {
            ALOG.e("JavaScriptInterface", "setExport ------------- :$webMessage")
            ToastHelper.showToastShortIncenter(mContext, "setExport :$webMessage")
            val bean = Export()
            bean.exportName = webMessage
            if (ExportManager.getExports(mContext).size == 0) {
                ExportManager.addExport(mContext, bean)
            } else {
                val bean2 = ExportManager.getExports(mContext)[0]
                bean2.exportName = bean.exportName
                ExportManager.updateExport(mContext, bean2)
            }

            if (ExportManager.getExports(mContext)[0].exportName == webMessage) {
                return 0
            }
            return 1
        }

        @JavascriptInterface
        fun getExport(): String {
            ALog.e(
                "MainActivity",
                "getExport ------------- " + ExportManager.getExports(mContext)[0].exportName
            )
            ToastHelper.showToastShortInCenter(
                mContext,
                "setExport :" + ExportManager.getExports(mContext)[0].exportName
            )
            return ExportManager.getExports(mContext)[0].exportName
        }

Room

这个图说明 就是刚刚演示的 在H5页面输入123456 然后传给我（android）保存本地数据库 然后H5什么时候要这个数据 我什么时候从数据库取出来！

android与H5数据交互(kotlin)

关于room数据库的操作

请参考我另一篇博文 已经走过的坑！

@H_360_90@

Android Jetpack组件之Room数据库使用

共勉

这一篇博文主要知识有 android与H5的混合开发知识点 已经android对数据库的存储运用！ 学习永无止步 加油！

脚本宝典总结

以上是脚本宝典为你收集整理的android与H5数据交互(kotlin)全部内容，希望文章能够帮你解决android与H5数据交互(kotlin)所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。
标签：bitmapbugcapHashMapjavajavascriptloadloadphppythonString开发开发数据库数据库程序员程序员重构
猜你在找的心得技巧相关文章
其他相关热搜词更多
phpjavapython程序员loadpost-format-gallerydivString参数开发ListcapMapClass工具安装SQL数据库资源this
全站导航更多
html5HTML/XhtmlCSSXML/XSLTDreamweaver教程Frontpage教程心得技巧JavaScriptASP.NETPHP编程正则表达式AJAX相关ASP编程JSP编程编程10000问CSS/HTMLFlexvbsDOS/BAThtahtcpythonperl游戏相关VBA远程脚本ColdFusionMsSqlMysqlmariadboracleDB2mssql2008mssql2005SQLitePostgreSQLMongoDB星外虚拟主机华众虚拟主机Linuxwin服务器FTP服务器DNS服务器Tomcatnginxzabbix云和虚拟化bios系统安装系统系统进程Windows系列LINUXRedHat/CentosUbuntu/DebianFedoraSolaris红旗Linux建站经验微信营销网站优化网站策划网络赚钱网络创业站长故事alexa域名photoshop教程摄影教程Fireworks教程CorelDraw教程Illustrator教程Painter教程Freehand教程IndesignSketch笔记本主板内存CPU存储显卡显示器光存储鼠标键盘平板电脑安全教程杀毒防毒安全设置病毒查杀脚本攻防入侵防御工具使用业界动态Exploit漏洞分析
最新心得技巧教程
热门心得技巧教程