[Kotlin] webView에서 Activity로 명령 주고받기

코틀린을 사용한 안드로이드 개발을 진행하며 웹뷰를 통해 데이터를 주고받는 경우가 필요했다.
html문서를 수정도 해야했고, 수정된 html문서를 모바일에서 pdf로 저장도 해야했는데, 이 단계를 하나하나 설명하려고 한다.
 

이런 절차를 거쳐야 했다..

 
 
따라서 WebView와 ViewActivity의 송수신이 필요했고, 내가 작성한 방법은 다음과 같다.
 
 

addJavascriptInterface

안드로이드의 WebView에 구현되어 있는 함수로서 기본 구조는 다음과 같다

val webView: WebView = findViewById(R.id.webview)
webView.settings.javaScriptEnabled = true // JavaScript를 활성화
webView.addJavascriptInterface(JavaObject, "InterfaceName")

//        webView.addJavascriptInterface(WebAppInterface(this), "Android")

여기서 webView는 사용자가 만든 webView 객체 (binding이든 R.id든.. 아무튼 그거) 
JavaObject는 js가 호출할 수 있는 메소드를 포함하는 Java객체.
InterfaceName은 JavaScript코드내에서 사용될 객체의 이름이다.
 

class WebAppInterface(private val context: Context) {
    @JavascriptInterface
    fun showToast(toast: String) {
        Toast.makeText(context, toast, Toast.LENGTH_SHORT).show()
    }
}

 
이런식으로 만들어준 뒤
 
js 부분에 해당 함수를 불러주면 된다.
 

function callFromJavascript() {
        Android.showToast("Hello from JavaScript");
    }

 
아주 기본적인 예제는 이러하다.
 
그렇다면 조금더 활용해보자.
 
나같은 경우에는 html이 로드될때 DB에서 정보를 가져온것들을 적용시켜야했다.
 
때문에 
 
아래와같이 로드시 Android에서 작성한 readListByPage()함수를 불러오도록 수행했다.

window.onload = function() {
    Android.readListByPage();
}

 
 
아까 작성한 WebAppInterface클래스 안에

 @JavascriptInterface
fun readOneListByPage() {
    GlobalScope.launch(Dispatchers.Main) {
        val p = webView.url!!.substringAfterLast('_').substringBeforeLast('.')
        readOneListByPage(webView = webView, page = p)
    }
}

suspend fun readOneListByPage(webView: WebView, page: String) {
	try{
    		Container.readOneListByPage(page){responseBody ->
// ... rest에서 데이터를 가지고 오는 로직...
		
            val gson = Gson()
            val json = gson.toJson(responseBody)
            val jsCode = "setResult('$json');"
            webView.post {
                webView.evaluateJavascript(jsCode, null)
            }
        }
	} catch (e : Exception){
        printString(e.message.toString())
    }finally {
    }

}

이렇게.. 작성해줘서 REST API로 받은 데이터를 다시 WebView로 돌려주었다.
 
돌려주는 방식은 webView.post 부분이다.