곧 출시될 ColdFusion10에서는 HTML5 Socket을 완벽히 지원하고 있는데, 사용법이 매우 쉽습니다. HTML5소켓은 서버측에서 데이터를 푸시할 수 있는 장점이 있지만 모든 브라우저가 지원되지 않는 것이 약간의 문제라면 문제입니다.

과거 Flash remoting을 이용할 경우 서버측에서 푸시할 수 있는 장점이 있었지만 클라이언트측 브라우저에 Flash Player가 반드시 설치되어야 한다는 문제점?이 있었습니다만 HTML5 소켓의 경우 Flash Player가 기본적으로 필요가 없습니다.

그런데 역설적으로 iPhone 등의 사파리 브라우저에서는 기본적으로 HTML5를 지원하므로 그대로 HTML5소켓기능을 적용할 수 있지만 IE6과 같은 구형 브라우저에서는 HTML5를 지원하지 않습니다만 ColdFusion10에서는 만약 Client의 IE6에 Flash Player가 설치되어 있다면 HTML5소켓메시지를 수신할 수 있습니다. 즉, ColdFusion10 서버를 이용하면 대부분의 브라우저 환경에서 HTML5소켓을 쓸 수 있다는 것이죠.

이 경우 Client측에서 할일이라곤 오로지 IE6에 맞는 Flash Player를 설치하는 것 뿐입니다.(사실 대부분의 브라우저에서 기본 설치되어 있어서 따로 설치할 필요는 없지만)

아래의 그림을 보시면 까만 테두리의 Chrome 브라우저는 Windows7(64bit)환경에서 구동된 것이고 Virtualbox내의 IE6브라우저는 Windows2003 server에서 구동된 것 입니다. 이 IE6에 Flash Player가 설치되어  있지 않다면 Chrome에서 전송하는 메시지를 전혀 수신 할 수 없지만 만약 Flash Player가 설치되어 있다면 아래 그림처럼 수신(송신 역시 가능)이 가능합니다. 어때요? 멋지지 않나요?

<Adobe ColdFusion10을 사용하면 IE6에서도 HTML5소켓 메시지를 송수신할 수 있습니다>

간단한 소스를 살펴보겠습니다. 이 소스의 원본은 Evey's notes(http://www.eveysijo.com/2012/02/coldfusion-websocket-part2how-do-i.html)이며 필요없는 부분은 삭제하였습니다. 아울러 Adobe ColdFusion10 Beta 기술문서에서 HTML5 Socket 부분만 따로 뺀 PDF파일을 아래에서 다운로드해서 살펴보시길 바랍니다. 신규로 추가된 ColdFusion 함수인 wspublish()를 사용하여 웹소켓채널(Application.cfc에서 정의한 채널)로 데이터를 전송하고, 수신부(index.cfm)의 <cfwebsocket>태그로 해당 체널의 데이터를 수신하는 간단한 구조입니다만 Adobe ColdFusion10은 매우 쉽고 빠르게 웹소켓어플리케이션을 제공할 수 있는 장점이 있습니다. 

Adobe ColdFusion10 Beta document : coldfusion_10_html5_websocket.pdf

Application.cfc

<cfcomponent>
	<cfscript>
		this.name="publishexample";
		this.wschannels=[{name="publishdemochannel"}];
	</cfscript>
</cfcomponent>

index.cfm

<script type="text/javascript">
	function mymessagehandler(atoken) {
		if (atoken.data != null) {
			var message = atoken.data;
			var txt = document.getElementById("myDiv");
			txt.innerHTML += message + "<br>";
		}
	}
</script>

<cfwebsocket name="mycfwebsocketobject"
			 onmessage="mymessagehandler"
			 subscribeto="publishdemochannel" />

<cfdiv id="myDiv"></cfdiv>

push.cfm

<cfif isdefined("form.message") >
	<cfset wspublish("publishdemochannel", form.message)>
</cfif>

<form action="push.cfm" method="POST">
	Message:<input name="message" type="text" />
	<input type="submit" name="Submit"/>
</form>