Network 디바이스API 가이드 프로그램

Network 가이드 프로그램은 모바일 디바이스 API 실행환경을 활용하여 하이브리드 앱을 개발 시 참고 및 활용될 수 있도록 구현 된 전자정부 디바이스 API에 대한 가이드 앱으로써, 모바일 스마트 디바이스의 Network 관련 기능을 JavaScript 기반으로 구성 된 Network DeviceAPI 를 통하여 조회할 수 있도록 지원한다.
또한, 전자정부 표준프레임워크 기반의 웹 서버 어플리케이션과 연계하여 디바이스 내 Network 정보를 체크하여 미디어를 플레이 하는 기능과 네트워크 정보를 서버에 전송하고 조회할수 있는 기능으로 구성되어 있다.

본 가이드 프로그램 에서는 Network 기능을 가이드 할 수 있도록 네트워크 상태를 체크하여 미디어 플레이 하기, 네트워크 정보를 서버에 전송하기,
네트워크 정보 목록을 서버로부터 수신하기 를 제공하고 있다.

Network 디바이스API 가이드 프로그램은 크게 네트워크 상태를 체크하여 미디어 플레이 하기, 네트워크 정보를 서버에 전송하기,
네트워크 정보 목록을 서버로부터 수신하기 기능으로 구성되어 있다.(관련기능 부분참조)

• 현재 디바이스의 네트워크 상태 정보

var states = {};
states[Connection.UNKNOWN]  = 'Unknown connection';
states[Connection.ETHERNET] = 'Ethernet connection';
states[Connection.WIFI]     = 'WiFi connection';
states[Connection.CELL_2G]  = 'Cell 3G connection';
states[Connection.CELL_3G]  = 'Cell 3G connection';
states[Connection.CELL_4G]  = 'Cell 4G connection';
states[Connection.NONE]     = 'No network connection';

var NowNetwork = states[navigator.connection.type];

• 디바이스 내의 오디오 파일 재생 또는 녹음 기능을 제공하는 역할을 하는 객체이다.
  

var media = new Media(src, mediaSuccess, [mediaError], [mediaStatus]);

• 오디오 파일의 재생을 멈춘다.
  

media.pause();

• 미디어 파일을 재생을 한다.
  

media.play();

• 운영체제(OS) 혹은 메모리 내의 Media 객체에 등록된 오디오 파일을 해제한다.
  

media.release();

• Media API 에 대한 에러 코드이다.

• NETWORK

• 미디어 재생 시, 기존 Web에서 사용하는 스트리밍 방식을 이용하기 때문에 네트워크 상태가 Wi-fi 가 아닌 상태에서는 데이터 사용량을 유의하여야 한다.

<plugin name="NetworkStatus" value="org.apache.cordova.NetworkManager" />
<plugin name="Media" value="org.apache.cordova.AudioHandler" />

<string name="SERVER_URL">http://192.168.100.222:8080/DeviceAPIGuideTotal_Web_V1.7.1</string>

    <!--전자정부 Interface 디바이스 API에서 사용하기 위한 서버경로 설정-->
    <?xml version="1.0" encoding="utf-8"?>
    <resources>
	<string name="SERVER_URL">서버_URL</string>
    </resources>

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
 
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

• 업로드 된 파일 저장 위치

<entry key="fileStorePath" value="파일_저장_경로"/>

<sqlMap resource="egovframework/sqlmap/hyb/add/nwk/EgovDeviceAndroidAPIGuide_SQL_[DB명].xml"/>

• 최초 앱 실행시 네트워크를 체크하여 Wi-Fi가 아닐 경우에는 사용자 승인여부에 따라 동작한다.
• 미디어 스트리밍시 네트워크를 체크하여 Wi-Fi가 아닐 경우에는 항상 사용자 승인여부를 체크한다.

var  isNetworkCheck = false;
function fn_egov_network_check(doCheck)
{
    console.log('DeviceAPIGuide fn_egov_network_check');
    var networkState = navigator.connection.type;
    
    if (networkState == Connection.UNKNOWN || networkState == Connection.NONE)
    {
        jAlert("네트워크가 연결되어 있지 않습니다.", "알림", "b");
        return false;
    }
    if(networkState != Connection.WIFI)
    {
        if(!doCheck) 
        {
            if(isNetworkCheck)
            {
                return true;
            }
        }
		
	if(confirm('Wi Fi 망이 아닐경우 추가적인 비용이 발생 할 수 있습니다. \n계속 하시겠습니까?')) 
        {		
	    isNetworkCheck = true;
            return true;
        } 
        else 
        {		
            isNetworkCheck = false;
            return false;
        }		
    }
    else
    {		
        return true;
    }
}

function fn_mediaPlayEvent() {
	
	fn_insertNetworkInfo();
	
	fn_mediaPlay();
	
	playTimer = setInterval(function(){
		mediaObj.getCurrentPosition(fn_currentPositionSuccess, fn_currentPositionError);
	}, 1000);
}

function fn_mediaPlay() {
	
	mediaObj.play();
}

function fn_insertNetworkInfo() {
	
	var url = "/nwk/addNetworkAndroidInfo.do";
	var acceptType = "xml";
	
	var networktype = fn_getDeviceInfo();
	
	var params = {
				uuid :  device.uuid,
			        networktype : networktype,
			        useYn : "Y"
				};
	
	$.mobile.showPageLoadingMsg();
	egovHyb.post(url, acceptType, params, function(xmldata) {
		
		console.log("DeviceAPIGuide fn_insertNetworkInfo request Completed");
		
		$.mobile.hidePageLoadingMsg();
	});
}

네트워크 메뉴 화면

기능설명 : 기능설명 화면으로 이동한다.
라이선스 : 라이선스 화면으로 이동한다.
Media Play: 네트워크 상태를 체크하여 Wi-Fi 가 아닐 경우에는 사용자 승인에 따라 서버의 미디어를 재생하고 디바이스의 네트워크 정보를 업로드한다.

• 네트워크를 체크하여 Wi-Fi가 아닐 경우에는 사용자 승인여부에 따라 동작한다.

function fn_selectNetworkInfoList() {
	
	var url = "/nwk/networkAndroidInfoList.do";
	var acceptType = "xml";
	
	var params = {};
	
	$.mobile.showPageLoadingMsg();
	egovHyb.post(url, acceptType, params, function(xmldata) {

		console.log("DeviceAPIGuide fn_selectNetworkInfoList request Completed");
		
		fn_displayList(xmldata);
	});
}

function fn_selectNetworkInfo(sn) {
	
	var url = "/nwk/networkAndroidInfo.do";
	var acceptType = "xml";
	
	var params = {
					sn : sn
				};
	
	$.mobile.showPageLoadingMsg();
	egovHyb.post(url, acceptType, params, function(xmldata) {
		
		console.log("DeviceAPIGuide fn_selectNetworkInfo request Completed");
		
		fn_displayNetworkInfoDetail(xmldata);
		
		$.mobile.changePage($("#networkInfoDetail"));
	});
}

function fn_deleteNetworkInfo() {
	
	var url = "/nwk/deleteNetworkAndroidInfo.do";
	var acceptType = "xml";
	
	var params = {
					sn : currentNetworkInfoSn
				};
	
	$.mobile.showPageLoadingMsg();
	egovHyb.post(url, acceptType, params, function(xmldata) {
		
		console.log("DeviceAPIGuide fn_deleteNetworkInfo request Completed");
		
		$.mobile.hidePageLoadingMsg();
		jAlert("삭제되었습니다", "알림", "b", function(){
			
			$.mobile.changePage($("#apiListView"), {changeHash:false});
		});
	});
}

네트워크 목록 조회 화면	상세정보 화면

기능설명 : 기능설명 화면으로 이동한다.
라이선스 : 라이선스 화면으로 이동한다.
리스트 : 선택한 리스트의 네트워크 상세 정보를 표시한다.
목록 : 네트워크 정보 목록 페이지를 호출한다.
삭제 : 선택한 네트워크 정보를 삭제한다.

• 프로젝트 선택 > 오른쪽 클릭 > Run As > Android Application

• 상단의 메뉴 > Run As > Android Application

• 실행할 타겟 선택 > 에뮬레이터, 디바이스(디버깅모드)

• 디바이스를 이용한 실행 화면

• 서버사이드 가이드 프로그램의 실행은 프로젝트를 마우스 오른쪽 버튼을 클릭 한후 Run As>Run On Server 버튼을 통해 실행 할 수 있다.

• 빌드가 성공적으로 수행 되면 이클립스의 콘솔 창에서 'Server Startup in xxx ms' 메시지를 확인 할 수 있다.

디바이스 어플리케이션에서 발생한 오류 내용 확인 및 디버깅을 위해서는 Phonegap 프레임워크에서 제공하는 console.log를 이용할 수 있다. console.log 함수는 자바스크립트 구문에서 사용할 수 있는 디버그 코드로 이클립스 및 Xcode에서 확인 할 수 있다.

console.log의 작성 방법은 다음과 같다.

function fn_egov_network_check(doCheck)
{
    console.log('DeviceAPIGuide fn_egov_network_check');
    var networkState = navigator.connection.type;
    ...
}

디버깅 코드가 실행 되면 아래와 같은 메시지를 개발도구의 콘솔 메시지 창에서 볼 수 있다.

Network 디바이스 API 가이드 프로그램 에서는 디버깅을 위하여 다음과 같이 콘솔 정보를 출력한다.

Network 디바이스 API 가이드 다운로드 : Click

• Cordova : Click
  
• UX/UI 라이브러리 : jQuery MobileClick