Kotlin和H5通讯的两种方式

第一种：

在h5中调用kotlin的方法:使用flask起一个简单的web项目，在项目中添加一个按钮，并加入js代码

然后在kotlin中创建一个类：

1. package com.example.mykotlinh5
2.  
3. import android.content.Context
4. import android.webkit.JavascriptInterface
5. import android.widget.Toast
6.  
7. // Kotlin与H5通讯的桥梁类
8. class JsMethods(context:Context) {
9.  
10. // 上下们对象
11. private var mContext = context
12.  
13. @JavascriptInterface // 安卓4.2之后都要加
14. fun shouToast(json:String) {
15. // 第一种方式弹出
16. Toast.makeText(mContext, json, Toast.LENGTH_SHORT).show()
17.  
18. }
19.  
20. }

在main Activity中：

1. package com.example.mykotlinh5
2.  
3. import android.annotation.SuppressLint
4. import androidx.appcompat.app.AppCompatActivity
5. import android.os.Bundle
6. import android.webkit.WebChromeClient
7. import android.webkit.WebView
8. import android.webkit.WebViewClient
9. import kotlinx.android.synthetic.main.activity_main.*
10. import org.json.JSONObject
11.  
12. class MainActivity : AppCompatActivity() {
13.  
14. // 懒加载：使用的时候才初始化
15. private val mWebView:WebView by lazy {
16. web_v
17. }
18.  
19. override fun onCreate(savedInstanceState: Bundle?) {
20. super.onCreate(savedInstanceState)
21. setContentView(R.layout.activity_main)
22. // 使用anko快速找到id，并设置里面的值
23.  
24. // 开启kotlin与h5通讯的开关
25. mWebView.settings.javaScriptEnabled = true
26.  
27. // 设置两个webViewClient
28. mWebView.webViewClient = MyWebViewClient()
29. mWebView.webChromeClient = MyWebChromeClient()
30.  
31. //H5与Kotlin桥梁类通讯的桥梁类：第一个参数是被调用方法的对象，第二个参数是对象别名
32. mWebView.addJavascriptInterface(JsMethods(this), "jsInterface")
33.  
34. //
35. mWebView.loadUrl("http://192.168.1.23:5000/")
36. }
37.  
38. // 创建两个WebViewClient
39. private inner class MyWebViewClient : WebViewClient() {
40. // 当页面加载完成调用的方法
41. override fun onPageFinished(view: WebView?, url: String?) {
42. super.onPageFinished(view, url)
43. // 调用H5的方法：Kotlin调用h5方法规范：mWebView.loadUrl("javascript:方法名(参数)")
44. var json = JSONObject()
45. json.put("name", "我是Kotlin传给H5的方法")
46. val jsString = json.toString()
47. mWebView.loadUrl("""javascript:showMessage($jsString)""")
48. }
49. }
50.  
51. // lambda表达式
52.  
53.  
54. // 创建一个ChromeClient
55. private class MyWebChromeClient : WebChromeClient() {
56. // 控制加载的进度条
57. override fun onProgressChanged(view: WebView?, newProgress: Int) {
58. super.onProgressChanged(view, newProgress)
59. }
60. }
61. }

然后就可以在页面中调用到了：

---

如有失效，请留言告知丨转载请注明原文链接：Kotlin和H5通讯的两种方式