12.Network

Edit

12.1Network 소개

Network는 모바일 장치에서 네트워크 연결 정보를 확인할 때 사용하는 오브젝트입니다. 사용자는 Network 오브젝트에서 제공하는 속성과 메소드를 사용해 주기적으로 네트워크 연결 상태를 확인할 수 있습니다.

12.2연결된 네트워크 확인하기

모바일 장치가 현재 어떤 네트워크로 연결되어 있는지 확인하려면 availabletype 속성과 watchStart, watchStop 메소드를 사용합니다. 사용자는 watchStart 메소드를 수행하여 설정된 시간마다 주기적으로 네트워크 연결 정보를 availabletype 속성을 통해 확인할 수 있습니다. 네트워크 연결 정보가 더 이상 갱신되길 원치 않으면 watchStop 메소드를 수행합니다.

12.2.1예제

Check Start 버튼을 터치하면 현재 연결된 네트워크 정보와 시간 정보를 받아 이미지와 로그에 표시합니다. Check Stop 버튼을 터치하면 더 이상 정보를 갱신하지 않습니다.

그림 12-1Screenshot_20180718-181415

12.2.2예제에서 사용한 핵심 기능

Network > availabletype 속성

모바일 장치에서 현재 연결된 네트워크 정보를 갖는 읽기 전용 속성입니다. 상태 값에 따른 네트워크 정보는 다음과 같습니다.

설명

0

연결된 네트워크 없음

1

3G 혹은 LTE 네트워크

2

WIFI 네트워크

Network > watchStart 메소드

모바일 장치에서 네트워크 상태 정보를 일정 간격마다 수신하는 메소드입니다. 수신 주기는 200~86,400,000 ms 사이의 값으로 설정할 수 있습니다. 수신 정보는 availabletype, timestamp 속성에서 확인할 수 있습니다.

Network > watchStop 메소드

watchStart 메소드의 수행을 종료하는 메소드입니다.

12.2.3예제 구현 방법

1

화면 구성하기

Network 오브젝트를 추가합니다. 추가된 Network 오브젝트는 Invisible Object 창에서 확인할 수 있습니다.

화면을 구성하기 위한 Static, Button 컴포넌트를 예제의 그림과 같이 적절히 배치합니다.

화면 구성을 위해 사용한 컴포넌트 및 오브젝트는 다음과 같습니다.

컴포넌트/오브젝트

ID

Network

Network00

GroupBox

GroupBox00

Static

stt_datanetwork

stt_wifi

stt_none

stt_logtitle

ImageViewer

img_datanetwork

img_wifinetwork

TextArea

ta_log

Button

btn_watch

2

watchStart 버튼 이벤트 함수 작성하기

watchStart 버튼의 onclick 이벤트를 다음과 같이 작성합니다. watchStart 메소드의 인자는 밀리초 단위입니다.

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
    this.Network00.watchStart(1000);
};

3

watchStop 버튼 터치 이벤트 함수 작성하기

watchStop 버튼의 onclick 이벤트를 다음과 같이 작성합니다.

this.Button01_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
    this.Network00.watchStop();
};

4

Network 오브젝트 이벤트 함수 작성하기

watchStart 메소드가 수행되면 설정된 간격으로 네트워크 정보가 수신되며 수신된 정보는 Network 오브젝트의 이벤트 함수에서 얻을 수 있습니다.

  • onrecvsuccess 이벤트 함수

watchStart 메소드가 정상적으로 수행되면 onrecvsuccess 이벤트가 호출됩니다. availabletype 속성에는 네트워크 정보가 저장되고 timestamp 속성에는 네트워크 정보를 수신한 시간이 저장됩니다.

availabletype 속성의 값은 숫자 형태이므로 사용자가 알아볼 수 있도록 fn_getNetworkType 함수를 사용해 문자열 형태로 변경해줍니다.

this.Network00_onrecvsuccess = function(obj:nexacro.Network,e:nexacro.NetworkEventInfo)
{
    var strResult = this.fn_getNetworkType(this.Network00.availabletype);
    
    this.stt_network.set_text(strResult);
    this.stt_timestamp.set_text(this.Network00.timestamp);
};
  • onrecverror 이벤트 함수

watchStart 메소드 수행시 에러가 발생하면 호출되는 에러 이벤트 함수입니다.

this.Network00_onrecverror = function(obj:nexacro.Network,e:nexacro.NetworkErrorEventInfo)
{
    var strResult = "["+ e.errortype +" "+ e.statuscode +"] "+ e.errormsg;
    
    this.stt_network.set_text(strResult);
};
  • fn_getNetworkType 함수

fn_getNetworkType 함수는 availabletype 속성 값을 사용자가 알아볼 수 있는 문자열로 변환해 반환합니다.

this.fn_getNetworkType = function(intAvailableType)
{
    var strNetworkType;
    
    switch(intAvailableType)
    {
        case 1:
            strNetworkType = "3G/LTE";
            break;
        case 2:
            strNetworkType = "WIFI";
            break;
        case 0:
        default:
            strNetworkType = "NONE";            
    }
    
    return strNetworkType;
}

5

모바일 장치에서 확인하기

watchStart 버튼을 터치한 후 모바일 장치의 네트워크를 WIFI나 3G/LTE로 변경하여 현재 네트워크 정보가 정상적으로 수신되는지 확인합니다.

12.3URL 접속 확인하기

앱에서 특정 URL에 접근하기 전에 해당 URL로의 접근이 문제가 없는지 확인할 필요가 있습니다. 이 때, Network 오브젝트의 isReachable 메소드를 사용하면 간편히 확인이 가능합니다.

12.3.1예제

가상 키보드를 사용해 URL을 입력 후 Enter 키를 입력합니다. 해당 URL로의 접근에 문제가 없으면 하단의 브라우저에서 웹 페이지를 표시합니다. 입력한 URL로의 접근이 불가능하면 팝업창으로 에러 메시지를 출력합니다.

그림 12-2Screenshot_20180718-181745

12.3.2예제에서 사용한 핵심 기능

Network > isReachable 메소드

모바일 앱에서 특정 URL로의 접근에 문제가 없는지 확인하는 메소드입니다.

12.3.3예제 구현 방법

1

화면 구성하기

Network 오브젝트를 추가합니다. 추가된 Network 오브젝트는 Invisible Object 창에서 확인할 수 있습니다.

화면을 구성하기 위한 Static, Button 컴포넌트와 URL 입력을 받기 위한 Edit 컴포넌트를 예제의 그림과 같이 적절히 배치합니다.

화면 구성을 위해 사용한 컴포넌트 및 오브젝트는 다음과 같습니다.

컴포넌트/오브젝트

ID

Network

Network00

Static

stt_text

Edit

edt_url

Button

btn_verification

btn_clear

2

Go 버튼 이벤트 함수 작성하기

Go 버튼의 onclick 이벤트를 다음과 같이 작성합니다.

this.btn_go_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
    var strURL = this.edt_url.value;
    
    if(nexacro._isNull(strURL) || strURL == "")
    {
        this.edt_url.setFocus();
    }
    else
    {
        this.Network00.isReachable(strURL);    
    }        
};

3

Edit 컴포넌트 이벤트 함수 작성하기

Edit 컴포넌트의 onkeydown 이벤트 함수를 다음과 같이 작성합니다. 가상 키보드의 엔터키 입력을 처리합니다.

this.edt_url_onkeydown = function(obj:nexacro.Edit,e:nexacro.KeyEventInfo)
{
    if(e.keycode == "13")    //Enter key code
    {            
        this.btn_go_onclick();
        this.btn_go.setFocus();
    }
};

4

Network 오브젝트 이벤트 함수 작성하기

  • onrecvsuccess 이벤트 함수

isReachable 메소드가 정상적으로 수행되면 onrecvsuccess 이벤트가 호출됩니다.

this.Network00_onrecvsuccess = function(obj:nexacro.Network,e:nexacro.NetworkEventInfo)
{
    var strResult = this.edt_url.value +" is reachable.";
    
    this.stt_result.set_text(strResult);
};
  • onrecverror 이벤트 함수

isReachable 메소드 수행시 에러가 발생하면 호출되는 에러 이벤트 함수입니다.

this.Network00_onrecverror = function(obj:nexacro.Network,e:nexacro.NetworkErrorEventInfo)
{
    var strResult = this.edt_url.value +" is unreachable.";
    
    this.stt_result.set_text(strResult);
};

5

모바일 장치에서 확인하기

URL을 입력하고 Go 버튼을 터치하여 해당 URL로의 접근 가능 여부를 확인합니다.