'javascript'에 해당되는 글 2건

  1. 2021.05.27 코틀린 코루틴(Coroutine)을 아라보자
  2. 2010.07.16 WebView (6)
Android2021. 5. 27. 14:24


고전적인 비동기 처리라 하면 Thread와 mutex, semaphore를 활용한 방법이 있겠다.
이어 개발자들은 비동기 처리를 좀더 쉽게 하기 위해 나온게 Rx시리즈가 있는데 이는 데이터 흐름과 함수형프로그래밍의 관점에서 다루어서 더 인기가 있게 되었다.
이어서 일부 언어에서는 코루틴을 지원하기 시작했고 안드로이드의 새로운 개발언어인 kotlin도 지원하기에 이르렀다.
c#, javascript, go등의 언어에서 await, async를 사용해보았다면 이미 알고 있는 것이다.

스레드로 비동기적이면서 순차적인 작업을 하려고 하면 콜백을 사용하게 마련이고 이런 경우 단계가 늘어날수록 콜백의 늪에 빠지게 된다.

이를 좀더 이해하기 쉽게 코딩할수 있도록 지원한게 Rx시리즈이다.
순차적으로 파이프라인을 이어서 다음 작업을 진행할 수 있다.

그런데 Rx는 학습곡선이 좀 있다. 그리고 원하는 기능을 구현하기 위해서는 실제 작업을 수행하는 루틴과 별도로 부수적이 액세서리 코드들이 더 들어가게 된다.

코루틴은 이를 더 쉽고 간결하게 표한하게 해주며 코드의 가독성도 높여준다.

코루틴이 어떻게 이를 지원하는지에 대해서 먼저 간단하게 설명하겠다.

일반적인 루틴은 호출되면 프로그램의 컨텍스트가 해당 서브루틴으로 넘어가며 서브루틴에서 return될때 호출한 메인 루틴으로 컨텍스트가 복구된다. 이는 예상하는것보다 많은 비용이 수반된다.
코루틴은 메인루틴에서 코루틴이 호출될때 바로 빠져나오게 된다. 그리고 해당 코루틴이 끝나면 코루틴이 호출되었던 부분으로 다시 돌아올수 있다.

일반적인 루틴과 어떤 차이가 있는지에 대해 쉽게 설명하자면 서브루틴이 아주 오래걸리는 작업을 수행하는데 이 루틴이 메인UI스레드에서 동작중이라면 해당 작업이 완료되기전까지 화면이 멈추게 된다.
하지만 코루틴의 이 경우에도 화면이 멈추지 않고 다른 스레드는 돌아가게 된다. 

코루틴이 호출될때 별도의 스레드로 분리되어 호출되고 코드는 더 진행되지 않고 대기하는데 다른 스레드에 영향을 주지 않으면서 대기하다가 코루틴이 완료되면 다시 대기하였던 부분부터 수행된다고 생각하면 된다.

c#등의 언어로 아래와 같은 코드에 해당한다.

  await doSomething();

개발자들은 코드로 설명하는것이 항상 옳다.
thread, RxJava, coroutine으로 동일한 작업을 할 때의 차이를 코드로 살펴보자.

라면을 끓여 먹는다고 하자

라면을 사서 -> 냄비를 준비하고 -> 물을 부어 끊이고 -> 면과 스프를 넣어 끓인 후 -> 그릇에 담아서 -> 먹는다.

위 과정은 모두 순차적으로 진행해야함 최종적으로 내가 먹을 수 있다.
라면을 사지 않고 라면을 먹을수는 없다.

이를 비동기로 구현하려면 thread 호출로 해야 할것이고 이 경우 콜백형태를 사용할것이고

buyRamyeon(money) { ramyeon -> 
  getPot(ramyeon) { ramyeon, pot ->
    doBoilPot(ramyeon, pot) { cookedRamyeon ->
       moveToDish(cookedRamyeon) { ramyeonInDish ->
          eatIt(ramyeonInDish)
       }
    }
  }
}



이렇게 작업해도 문제는 없다. 다만 많은 비용을 수반하고 우리가 그 동안 많이 보아온 콜백지옥의 향연이 펼쳐진다.

이를 RxJava로 구현한다고 하면 아래와 비슷할것이다.

Observable.just(money)
.observeOn(MAIN_Thread)
.subscribeOn(IO_Thread)
.flatMap { money -> buyRamyeon(money) }
.flatMap { ramyeon -> getPot(ramyeon) }
.flatMap { ramyeon, pot -> doBoilPot(ramyeon, pot) }
.flatMap { ramyeonInDish -> moveToDish(cookedRamyeon) }
.subscribe({ 
ramyeonInDish -> eatIt(ramyeonInDish)
}, {
// 실패케이스 처리
})



콜백헬에서는 확실히 벗어난듯 하다.
하지만 just, observeOn, subscribeOn등에 대해 알아야 하며 Rx는 상당히 급한 학습곡선에 해당한다.

이를 coroutine으로 구현한다면 아래와 비슷할것이다.

suspend iWantEatRamyeon(money) {
  try {
    val ramyeon = buyRamyeon(money)
    val pot = getPot()
    val cookedRamyeon = doBoilPot(ramyeon, pot)
    val ramyeonInDish = moveToDish(cookedRamyeon)
    eatIt(ramyeonInDish)
  } catch (e: Exception) {
    // 실패케이스 처리
  }
}


Coroutine 문법을 자세히 아라보려면 https://selfish-developer.com/entry/Kotlin-Coroutine 여그를 보자. 잘 정리되어 있넹 

Posted by 삼스

댓글을 달아 주세요

Android/App개발2010. 7. 16. 15:42

웹페이지를 표시하는 뷰이다.

상속구조는 아래와 같다.

   ↳ android.view.View 
         ↳ android.webkit.WebView

웹브라우저에서 하는 역할을 모두 할 수 있으며 액티비티내에서 화면의 일부로 온라인컨텐츠를 표시할수 있다.
WebKin render engine을 사용하며 이전페이지, 다음페이지, 확대/축소, 텍스트검색등의 기능을 포함한다.

zoom기능을 활성화하려면 WebSettings.setBuiltInZoomControls(boolean)을 사용하라.

액티비티에서 인터넷을 억세스하고 웹페이지를 WebView에 표시하려면 아래 퍼미션을 매니페스트 파일에 추가하라.

<uses-permission android:name="android.permission.INTERNET"/>

기본적인 사용법
기본적으로 WebView는 브라우져와 유사한 위젯을 제공하지는 않는다. 자바스크립트는 비활성화되어 있으며 웹페이지에러는 무시된다. 그냥 UI의 일부로 HTML을 표시하고자 한다면 이정도면 충분하다. 만일 full-blown 웹브라우져를 원한다면 WebView를 이용하는것보다 그냥 인텐트를 날려서 브라우져에서 표시하고자 할것이다. 아래와 같이...

   Uri uri = Uri.parse("http://www.example.com");
   
Intent intent = new Intent(Intent.ACTION_VIEW, uri);
   startActivity
(intent);
 
액티비티에서 WebView를 제공하고자 한다면 layout에 <WebView>를 추가하거나 onCreate()에서 액티비티자체를 WebView로 지정하면 된다.
   WebView webview = new WebView(this);
   setContentView
(webview);
 
이어서 원하는 웹페이지를 로드한다.

// Simplest usage: note that an exception will NOT be thrown
 
// if there is an error loading this page (see below).
 webview
.loadUrl("http://slashdot.org/");

 
// OR, you can also load from an HTML string:
 
String summary = "<html><body>You scored <b>192</b> points.</body></html>";
 webview
.loadData(summary, "text/html", "utf-8");
 
// ... although note that there are restrictions on what this HTML can do.
 
// See the JavaDocs for loadData() and loadDataWithBaseURL() for more info.

WebView는 원하는 동작을 구현하기 위해 몇가지 수정가능한 방법을 제공한다.
 - WebChromeClient의 subclass를 생성하고 설정한다. 이 클래스는 브라우져UI에서 어떤 동작이 발생하면 호출된다. 예를 들어 update과정이나 자바스크립트 경고같은 것들이 이 클래스로 전달된다.
 - WebViewClient의 서브클래스를 생성하고 설정한다. 콘텐츠의 렌더링과 연관된 동작이 발생하면 호출된다. 예를 들어 에러나 폼서브미션시(form submission)에 호출된다. shouldOverrideUrlLoading()함수를 통해 URL이 로드되기전에 원하는 작업을 할 수도 있다.
 - WebSettings의 변경가능, setJavaScriptEnabled()로 자바스크립트를 활성화할 수 있다.
 - JavaScript-to-Java 인터페이스를 추가할 수 있다. addJavascriptInterface(Object, String)메소드로 가능하다. 이 함수는 자바오브젝트를 WebView에 바인드할 수 있다. 이렇게 하여 웹페이지의 자바스크립트를 제어할 수 있다.

아래 좀더 복잡한 예제가 있다, 에러핸들링의 표시, 셋팅, 진행상태 통지등의 예를 볼수 있다.

// Let's display the progress in the activity title bar, like the
 
// browser app does.
 getWindow
().requestFeature(Window.FEATURE_PROGRESS); // 타이틀바에 진행상태 아이콘표시모드로 변경한다.

 webview
.getSettings().setJavaScriptEnabled(true); // 자바스크립트를 활성화한다.

 
final Activity activity = this;
 webview
.setWebChromeClient(new WebChromeClient() { // WebChromeClient를 설정하고 진행상태 변동상태를 화면에 반영한다.
   
public void onProgressChanged(WebView view, int progress) {
     
// Activities and WebViews measure progress with different scales.
     
// The progress meter will automatically disappear when we reach 100%
     activity
.setProgress(progress * 1000);
   
}
 
});

 webview
.setWebViewClient(new WebViewClient() { // WebViewClient를 설정하여 에러발생시 토스트로 표시한다.
   
public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) {
     
Toast.makeText(activity, "Oh no! " + description, Toast.LENGTH_SHORT).show();
   
}
 
});

 webview
.loadUrl("http://slashdot.org/"); // 원하는 웹페이지를 연다.
 
쿠키와 윈도우관리
보안상의 이유로 당신의 애플리케이션은 자체 캐시와 쿠키 등의 저장소들을 가지고 있다. 이것은 브라우져애플리케이션의 데이터와 공유되지 않는다. 쿠키의 경우 스래드로 분리되어 관리된다. 그래서 UI thread에 의해 블럭되지 않는다. 애플리케이션에서 쿠리정보를 참조하고 싶다면 CookieSyncManager를 사용하라.

기본적으로 HTML에서 새로운 창에 여는기능은 무시된다. 이는 자바스크립트나 링크의 대상의 속성에의해 가능해진다. WebChromeClient를 수정하여 여러개의 윈도우로 페이지를 여는것을 당신 마음대로 변경할 수 있다.

액티비티의 기본동작은 configuration이 변경되면 destroy되었다가 다시 create되는것이다. 이 경우 WebView는 웹페이지를 다시 로딩하게 된다. 이게 싫다면 orientation과 keyboardHidden값을 변경하면 다시로드하지 않고 처리된다.

자주 사용된느 WebView관련 함수들
addJavascriptInterface() 자바스크립트의 자바 객체 접근 허용

createSnapshot() 현 페이지의 스크린샷 생성

getSettings() 설정을 조정하는  WebSettings 객체 반환 

loadData() 브라우저에 주어진 문자열 데이터 로딩

loadDataWithBaseURL() 기준 URL을 사용해 주어진 데이터 로딩

loadUrl() 주어진 URL을 사용해 웹페이지 로딩

setDownloadListener() 사용자가 .zip이나 .apk 파일을 다운받는 경우 등의 다운로드 이벤트의 콜백 등록

setWebChromeClient() 제목이나 진행률 표시줄을 업데이트하거나 자바스크립트 대화상자를 여등 등, WebView 영역밖에서 실행되는 이벤트의 콜백을 등록

setWebViewClient() 리소스 로딩하기, 키 눌림, 인증 요청 등의 이벤트를 방해하도록 애플리케이션이 브라우저에 걸림돌을 설정함.

stopLoading() 현재 페이지 로딩 멈추기







Posted by 삼스

댓글을 달아 주세요