====== 웹소켓 가이드 ======
이 화면은 WebSocket 컴포넌트 기본 기능 샘플 화면이다.
WebSocket 컴포넌트는 HTML5 WebSocket 통신 프로토콜 표준을 따르는 WebSocket 프로토콜 클라이언트 컴포넌트이다.
WebSocket 컴포넌트 API는 기본적으로 비동기 방식으로 동작하며, 이벤트를 통해 동작 상태를 확인해야 한다.
관련 API로 open, send, close가 있다.
관련 이벤트로 on_open, on_message, on_error, on_close가 있다.
===== 예시 =====
템플릿 위치: /HTML5/COMPONENT/WEBSOCKET/websocket_basic
템플릿 파일
* [[xf5projecthome>template/screen/HTML5/COMPONENT/WEBSOCKET/websocket_basic.xml|websocket_basic.xml]]
* [[xf5projecthome>template/screen/HTML5/COMPONENT/WEBSOCKET/websocket_basic.js|websocket_basic.js]]
* [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/WEBSOCKET/websocket_basic|새창으로 실행]]
echo '';
echo '';
echo '';
==== 화면 스크립트 ====
// "웹소켓 세션 연결" 이벤트 처리
function ws_on_open(objInst)
{
screen.alert("웹소켓 on_open> 세션 연결됨");
}
// "웹소켓 세션 해제" 이벤트 처리
function ws_on_close(objInst, nCode, strReason, wasClean)
{
screen.alert("웹소켓 on_close> 세션 해제됨" + "\n" +
"code = [" + nCode + "]\n" +
"reason = [" + strReason + "]\n" +
"wasClean = " + wasClean);
this.fld_onclose_code.settext(nCode);
this.fld_onclose_reason.settext(strReason);
this.fld_onclose_wasclean.settext(wasClean);
}
// "웹소켓 에러 발생" 이벤트 처리
function ws_on_error(objInst)
{
screen.alert("웹소켓 on_error> 에러 발생");
}
// "웹소켓 데이터 수신" 이벤트 처리
function ws_on_message(objInst, strMessage)
{
this.fldRecvData.settext(strMessage);
}
// "연결" 버튼 이벤트 처리
function btnConnect_on_mouseup(objInst)
{
this.ws.open(this.fld_websocket_server_addr.gettext());
}
// "해제" 버튼 이벤트 처리
function btnClose_on_mouseup(objInst)
{
this.ws.close();
}
// "수신 데이터 초기화" 버튼 이벤트 처리
function btnClear_on_mouseup(objInst)
{
this.fldRecvData.settext("");
}
// "데이터 송신" 버튼 이벤트 처리
function btnSend_on_mouseup(objInst)
{
var ret;
ret = this.ws.send(this.fldSendData.gettext());
if (ret == false) {
screen.alert("send fail");
}
}
// "on_close 이벤트 정보 초기화" 버튼 이벤트
function btn_clear_onclose_info_on_mouseup(objInst)
{
this.fld_onclose_code.settext("");
this.fld_onclose_reason.settext("");
this.fld_onclose_wasclean.settext("");
}