안드로이드의 webview

December 23, 2019 | 1 Minute Read

안드로이드의 기초(2)

**2019.12.23** 팀 : 콘텐츠보안팀 작성자 : 이상원

주제 : 안드로이드의 WebView

1. 웹뷰란?

가. 앱에는 크게 하이브리드앱과 네이티브앱 두가지로 나눌 수 있다. 네이티브 앱는 다양한 운영체제(OS: Operation System) 별로 선언 파일이나 이미지, 오디오 등의 리소스를 만들어야 한다. 그다음, 모바일 운영체제(OS)에서 제공하는 툴을 활용하여 소스코드를 컴파일하고, 여러 실행 파일을 만들어야 한다. 이처럼 네이티브 앱은 각기의 모바일 운영체제(OS)에서 제공하는 툴과 언어 등에 따라 기능들을 최대한 살리기 때문에, 높은 사양의 그래픽과 성능을 자랑하면서도 구동 속도가 빠른 편이다. 뿐만 아니라 디바이스 전체에 액세스 권한을 가질 수 있어, 기기에 저장된 주소록, 캘린더 등의 고유 정보를 사용할 수도 있다. 이와 대조적으로 하이브리드 앱은 웹 어플리케이션을 WebView라는 컴포넌트로 감싸 개발이 빠르며 수정이 쉽다는 장점이 있다. 이처럼 실용적인 하이브리드 앱을 만들기 위한 컴포넌트중 하나인 WebView에 대해 작성하려고 한다.

2. 권한 설정하기

앞의 블로그에서 말했듯이 AndroidManifest.xml 파일에 < uses-permission android:name=”android.permission.INTERNET” />을 추가한다. 인터넷에 관한 권한이다.

3. 레이아웃 설정

앱은 어디에 컴포넌트가 보여질지 레이아웃을 정해지는 소스가 따로 존재한다. 각화면(액티비티)당 하나로 구성되며 한페이지당 레이아웃도 하나씩 존재한다. 처음 앱을 만들면 생기는 activity_main.xml 파일에 웹뷰 컴포넌트를 추가한다. < WebView android:id=”@+id/webView” android:layout_width=”match_parent” android:layout_height=”match_parent”> < /WebView>

4. main 코드 설정

웹페이지상 자바스크립트와 기타 기능들을 모두 동작하게 하려면 허용해줘야하는 설정이 많다.

소스

	super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
 
    // 웹뷰 시작
    mWebView = (WebView) findViewById(R.id.webView);
 
    mWebView.setWebViewClient(new WebViewClient()); // 클릭시 새창 안뜨게
    mWebSettings = mWebView.getSettings(); //세부 세팅 등록
    mWebSettings.setJavaScriptEnabled(true); // 웹페이지 자바스클비트 허용 여부
    mWebSettings.setSupportMultipleWindows(false); // 새창 띄우기 허용 여부
    mWebSettings.setJavaScriptCanOpenWindowsAutomatically(false); // 자바스크립트 새창 띄우기(멀티뷰) 허용 여부
    mWebSettings.setLoadWithOverviewMode(true); // 메타태그 허용 여부
    mWebSettings.setUseWideViewPort(true); // 화면 사이즈 맞추기 허용 여부
    mWebSettings.setSupportZoom(false); // 화면 줌 허용 여부
    mWebSettings.setBuiltInZoomControls(false); // 화면 확대 축소 허용 여부
    mWebSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN); // 컨텐츠 사이즈 맞추기
    mWebSettings.setCacheMode(WebSettings.LOAD_NO_CACHE); // 브라우저 캐시 허용 여부
    mWebSettings.setDomStorageEnabled(true); // 로컬저장소 허용 여부
 
    mWebView.loadUrl("http://web-inf.tistory.com"); // 웹뷰에 표시할 웹사이트 주소, 웹뷰 시작

이와 같이 권한, 레이아웃, 코드를 작성하여 주면 누구나 쉽게 하이브리드 앱을 생성 할 수 있다.