Android webview에서 javascript로 함수 호출하기 ℡

Android에서 WebView의 용도는 무엇인가요?

WebView는 어플리케이션 내부에 웹 페이지를 보여주는 view 입니다. 안드로이드 에서는 'Acitivity 내부에서 웹 브라우저나 온라인 컨텐츠를 보여주기 위한 기반이 되는 클래스'라고 설명이 되어있습니다. 
웹 페이지를 보여주기 위해 웹킷 렌더링 엔진을 사용하고 history를 통한 앞으로 가기 뒤로가기 메소들르 포함하고, zoom in,out, text 찾기외 다양한 것을 포함하고 있습니다. 
어플리케이션에 Webview를 추가하기 위해서는 xml Layout file에 <Webview> 요소를 추가하여야 합니다.

WebChromeClient를 통해 chrome 핸들러를 추가할 수 있습니다.
alert, preload, confirm등의 표시와 액션을 제어할 수 있습니다.
onProgressChanged, onJsAlert, onShowFileChooser, onCreateWindow 와 같은 메서드들이 있습니다.

WebViewClient를 통해 notification을 설정할 수 있습니다.
웹뷰에서 일어나는 요청, 상태, 에러등의 콜백을 정의할 수 있습니다.
shouldOverridingUrl, onPageFinised, onReceivedError와 같은 메서드들이 있습니다.

 

Android webview에서 javascript로 네이티브의 함수를 호출하기 위한 방법입니다.

간단합니다.

 

• @JavascriptInterface 어노테이션을 활용합니다.
• webView의 세팅중 setJavascriptEnabled를 true로 설정해줍니다.
• webView의 addJavascriptInface 메소드를 통해 webview의 window에 속성을 추가해줍니다.
• webView내의 스크립트에서 추가된 속성으로 실행하길 원하는 메소드를 실행시킵니다

 

// JsObject.java

public class JsObject {
    Context mobileContext;
    
    public JsObject(Context context) { mobileContext = context }
    
    @JavascriptInterface
    public String getToast() { 
	    Toast.makeToast(mobileContext, "띄워보자 토스트", Toast.LENGTH_LONG).show()
    }
    
    @JavascriptInterface
    public String getMainToast() { 
	    MainActivity mainActivity = (MainActivity) mobileContext;
        mainActivity.getMainToast()
    }
 }
 
 // MainActivity.java
 
 public class MainActivity {
    
    public void getMainToast() {
        Toast.makeToast(this, "메인토스트!!!", Toast.LENGTH_LONG).show()
    }
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
     	Webview webview = findViewById(R.id.webview);
        
    	webview.getSettings().setJavaScriptEnabled(true);
        webView.addJavascriptInterface(new JsObject(), "wooBottle");
    }
 }

 

위와 같이 추가하고 크롬의 인스펙트에서 접근하면 

아래와 같이 JsObject에서 추가한 메서드들과 webview의 콘솔창에서 네이티브에 정의된 함수를 호출할 수 있습니다!

 

 

 

 

 

 

 

 

 

 

출처 : https://developer.android.com/reference/android/webkit/package-summary

android.webkit  |  Android Developers

https://developer.android.com/reference/android/webkit/WebSettings

WebSettings  |  Android Developers

https://developer.android.com/reference/android/webkit/WebView#addJavascriptInterface(java.lang.Object,%20java.lang.String) 

WebView  |  Android Developers