Life Log

WebView Setting 속성 정리

@SuppressLint("SetJavaScriptEnabled")
private fun webViewSetting(webView: WebView) {

    val webSettings = webView.settings

    webSettings.apply {
        //기본 설정
        
        //자바 스크립트 사용 허용
        javaScriptEnabled = true   
        //컨텐츠 크기에 맞게 화면 맞춤
        loadWithOverviewMode = true 
        //뷰 포트 설정
        useWideViewPort = true  
        //DOM저장소 사용
        domStorageEnabled = true    
        //파일 접근 허용
        allowFileAccess = true  
        //자바 스크립트로 새 창 열기 허용
        javaScriptCanOpenWindowsAutomatically = true  
        //멀티 윈도우 지원
        setSupportMultipleWindows(true) 
        //file://로 로드된 로컬HTML파일이 다른 로컬파일에 접근 할 수 있게 허용
        allowFileAccessFromFileURLs = true  
        //캐시 사용 기본 설정
        cacheMode = WebSettings.LOAD_DEFAULT    
        //웹 페이지의 텍스트와 레이아웃을 어떻게 배치 할지 설정
        layoutAlgorithm = WebSettings.LayoutAlgorithm.NARROW_COLUMNS   
        //플러그인 자동 실행 여부
        pluginState = WebSettings.PluginState.ON    
        //HTTPS페이지 안에서 HTTP콘텐츠 허용 여부
        mixedContentMode = WebSettings.MIXED_CONTENT_ALWAYS_ALLOW   
        //비디오나 오디오 자동 재생 여부 (false가 자동 재생 허용)
        mediaPlaybackRequiresUserGesture = false    
        //웹 콘텐츠를 Chrome개발자 도구로 디버깅 할 수 있게 해주는 설정(inspect)
        WebView.setWebContentsDebuggingEnabled(false)  

	//웹페이지의 이미지를 자동으로 불러올지 여부를 설정
        loadsImagesAutomatically = true 
        //웹 페이지의 기본 문자 인코딩 방식 지정
        defaultTextEncodingName = "utf-8"   
        
        //줌 관련
        //줌 기능 허용
        setSupportZoom(true)  
        //줌 컨트롤 사용
        builtInZoomControls = true  
        //줌 컨트롤 UI숨김
        displayZoomControls = false 
    }

}

private fun setScrollBarDisable(webView: WebView) {
    webView.apply {
    	//수직 스크롤바 노출 여부
        isVerticalScrollBarEnabled = false  
        //수직 스크롤바 웹뷰 내용 위에 겹쳐서 표시 노출 여부
        setVerticalScrollbarOverlay(false) 
        //수평 스크롤 바 노출 여부
        isHorizontalScrollBarEnabled = false   
        //수평 스크롤바 웹뷰 내용 위에 겹쳐서 노출 여부
        setHorizontalScrollbarOverlay(false)    
    }
}

javaScriptEnabled 

true: 자바 스크립트 코드 실행 가능

false: 자바 스크립트 실행 불가능

loadWithOverviewMode

true: 웹페이지가 화면 크기에 맞춰 전체가 보이도록 축소되서 로드

false: 웹페이지 원래 크기로 로드되고, 사용자가 스크롤 하거나 확대/축소해야 전체를 볼 수 있음

useWideViewPort

true: <meta name="viewport" ..> 태그 인식 가능, 웹페이지 레이아웃을 디바이스 화면 너비에 맞게 조정

false(default): 기본 너비를 사용해 페이지 렌더링

domStorageEnabled

true: WebView내의 HTML5의 로컬 스토리지와 세션 스토리지 같은 DOM Storage기능 활성화

false(default): DOM Storage기능 비활성화, 일부 기능 제한 

** DOM Storage란 웹페이지가 데이터를 브라우저 안에 저장할 수 있도록 해주는 기능이다.

localStorage와 sessionStorage두가지 종류가 있으며

localStorage는 창을 닫아도 데이터가 남아 있다 (반 영구적)

sessionStorage는 탭을 닫으면 데이터가 사라짐(세션 동안만 유지)

allowFileAccess

true: 웹 페이지가 기기의 내부 파일에 접근 할 수 있게 허용 (file://주소의 파일을 읽을 수 있게 허용)

false: 웹페이지가 기기의 내부 파일에 접근 할 수 있게 허용하지 않음

*보안 주의 -> 외부에서 불러온 웹사이트인 경우엔 false권장

javaScriptCanOpenWindowsAutomatically

true: 자바스크립트가 새 창을 자동으로 열 수있게 허용 (javascript -> window.open() 허용)

false(default): 자바스크립트가 새 창을 자동으로 열 수 없음

** 주의  광고나 악성 스크립트가 사용자 몰래 팝업을 열 수도 있음

setSupportMultipleWindows

true: 여러 창을 호출할 수 있게 지원 해줌 (javascript -> window.open() 실제 실행, javaScriptCanOpenWindowsAutomatically와 함께 true로 설정해야 함)

false(default): 여러 창을 호출할 수 없음

allowFileAccessFromFileURLs

true: file://주소로 로드된 웹페이지가 다른 파일에도 접근 가능 (신뢰된 페이지에서만 사용 권장) 

false(default): 접근 불가능 

cacheMode

웹페이지 데이터를 캐시에서 불러올지, 네트워크에서 새로 받을지 결정하는 설정 

WebSettings.LOAD_DEFAULT 

-> 기본 설정, 인터넷이 연결되어 있으면 항상 새로 로드하고 연결되어 있지 않은 경우에는 캐시 사용

WebSettings.NO_CACHE (항상 최신 데이터를 보여줘야 하는 경우)

-> 캐시 사용 X

WebSettings.LOAD_CACHE_ELSE_NETWORK (오프라인에서도 앱이 잘 동작해야 하는 경우)

-> 캐시에 데이터가 있는 경우 캐시 사용, 없는 경우 네트워크 요청

WebSettings.LOAD_CACHE_ONLY (오프라인에서도 앱이 잘 동작해야 하는 경우)

-> 항상 캐시만 사용 네트워크 요청 X

**캐시 지우는 방법 webView.clearCache(true)

layoutAlgorithm

HTML콘텐츠의 배치 방식을 설정하는 속성으로 Android10 (API29)부터 Deprecated됨

WebSettings.LayoutAlgorithm.NORMAL -> 기본 레이아웃 방식, 웹 브라우저처럼 표준대로 배치

WebSettings.LayoutAlgorithm.SINGLE_COLUMN -> 콘텐츠를 하나의 열로 정렬 (줄바꿈 포함)

WebSettings.LayoutAlgorithm.NARROW_COLUMNS -> 콘텐츠를 좁은 화면에 자동 맞춤

WebSettings.LayoutAlgorithm.TEXT_AUTOSIZING -> 텍스트 크기를 자동으로 조정

pluginState

WebView에서 플러그인(Flash 등)을 사용할 수 있게 할지를 설정하는 속성이지만 Android 5.0 (API21)이상 부터는 플러그인 자체가 제거되어 동작하지 않음

mixedContentMode

혼합 컨텐츠를 어떻게 처리할지 설정하는 속성

WebSettings.MIXED_CONTENT_NEVER_ALLOW -> 혼합 콘텐츠 전부 차단 (default)

WebSettings.MIXED_CONTENT_COMPATIBILITY_MODE -> 안전한 일부 콘텐츠만 허용(이미지) - 권장됨

WebSettings.MIXED_CONTENT_ALWAYS_ALLOW -> 모든 혼합 콘텐츠 허용(보안 취약)

**혼합 컨텐츠란https://로 열린 웹페이지에서 http://리소스를 불러오는 경우를 지칭한다. (http이미지, 스크립트, iframe 등을 사용하는 경우)

mediaPlaybackRequiresUserGesture

웹 뷰에서 오디오나 비디오같은 미디어가 자동으로 재생 될 수 있는지를 설정하는 속성 

true(default): 사용자가 클릭 등 제스처를 해야만 재생 가능 

false: 자동 재생 허용 (html에서 autoplay와 muted 속성을 같이 넣어줘야 자동재생됨 - 보안을 위해 대부분의 브라우저는 소리나는 미디어의 자동 재생을 막고있음) 

loadsImagesAutomatically

웹뷰에서 이미지를 자동으로 로드할지 여부를 묻는 속성 

true(default): 웹페이지에 포함된 이미지들을 자동으로 로드

false: 이미지 로드를 자동으로 하지 않음(텍스트만 보여짐)