아이폰의 경우 Native와 Web간의 통신을 위해서 scheme를 이용하지만
안드로이드에서는 JavascriptInterface를 이용하여 더욱 편하게 데이터를 주고 받을 수 있다.
예제로 간단한 Toast를 보여주는 인터페이스를 만들어 보겠다.
먼저 웹뷰에 추가 시킬 JavascriptInterface 클래스를 만든다.
public class WebViewInterface { private WebView mAppView; private Activity mContext; /** * 생성자. * @param activity : context * @param view : 적용될 웹뷰 */ public WebViewInterface(Activity activity, WebView view) { mAppView = view; mContext = activity; } /** * 안드로이드 토스트를 출력한다. Time Long. * @param message : 메시지 */ @JavascriptInterface public void toastLong (String message) { Toast.makeText(mContext, message, Toast.LENGTH_LONG).show(); } /** * 안드로이드 토스트를 출력한다. Time Short. * @param message : 메시지 */ @JavascriptInterface public void toastShort (String message) { // Show toast for a short time Toast.makeText(mContext, message, Toast.LENGTH_SHORT).show(); } }
안드로이드 4.3.X 젤리빈 이상부터 "@JavascriptInterface" annotation을 붙이지 않을 경우
해당 메쏘드는 동작하지 않기 때문에 반드시 붙여줘야한다.(킷캣이상인가??;;)
그리고 Activity의 onCreate 혹은 Fragment의 onCreateView 에서 loadUrl이 불리기전에
WebView 객체의 addJavascriptInterface 메쏘드를 이용해 연결시켜 주면 바로 사용할 수 있다.
무지 간단하다!
public class MainActivity { private WebView mWebView = null; private WebViewInterface mWebViewInterface; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); getWindow().requestFeature(Window.FEATURE_PROGRESS); setContentView(R.layout.activity_main); mWebView = (WebView) findViewById(R.id.webview); //웹뷰 객체 mWebViewInterface = new WebViewInterface(MainActivity.this, mWebView); //JavascriptInterface 객체화 mWebView.addJavascriptInterface(mWebViewInterface, "Android"); //웹뷰에 JavascriptInterface를 연결 } }
addJavascriptInterface를 보면 인터페이스 객체와, 웹에서 사용될 객체 명을 넣어준다.
위와 같이 연결을 하게 되면, 웹페이지에 window.Android 객체가 생성되고, WebViewInterface에 정의된
모든 메쏘드를 사용할 수 있게 된다.
웹페이지에 아래와 같이 입력하게 되면, 안드로이드 Toast를 통해 "JavascriptInterface Test"라는 문구가 보이게 된다.
window.Android.toastShort( "JavscriptInterface Test" );
'Programming > Hybrid App' 카테고리의 다른 글
[Hybrid, Web] 키 입력시 숫자만 가능하도록 세팅. (0) | 2016.06.10 |
---|---|
[Android, Hybrid]openFileChooser 킷캣에서 동작하지 않는 문제( openFileChooser Kitkat bug ) (43) | 2014.06.24 |
[HTML5] audio, video tag 지원 유무 확인 (0) | 2014.04.28 |
[Javascript] html tag 내에 있는 데이터 제거. (0) | 2014.04.08 |
[Javascript] 정규식. 전화번호, 휴대폰 번호 추출. 검증 (0) | 2013.12.20 |