FingerEyes-Xr for HTML5의 레이어 추가시 연결 완료 이벤트

FingerEyes-Xr에서 레이어를 추가하기 위한 매서드는 LayerManager의 add 입니다. 이 add 매서드는 2개의 인자를 받는데요. 첫번째는 추가하고자 하는 Layer 객체이고 두번째는 선택 사항으로 추가하려는 레이어가 네트워크를 통해 성공적으로 연결되었을 때 호출할 callback 함수입니다. 이 callback 함수는 레이어 추가시 개별적으로 세밀한 흐름 제어를 위해 사용됩니다. 이와 관련한 예는 아래와 같습니다.

var baseLyr = new Xr.layers.TileMapLayer(layerName,
    {
        url: "http://localhost/....",
        ext: "jpg"
    }
);

var lm = map.layers();

lm.add(baseLyr, 
    function (lyr) {
        lm.moveToFirst(layerName);
        map.updateLayer(layerName);
    }
);

위의 코드는 배경지도를 새롭게 추가할 때 추가된 레이어를 가장 첫번째 순위로 이동하고 추가된 레이어만을 새롭게 화면상에 업데이트하라는 코드입니다. 이러한 코드는 해당 레이어가 네트워크를 통해 완전히 연결된 이후에 실행되어야 하는 코드이므로 callback 함수의 사용에 적합합니다.

웹서버에 대한 Cross Domain 허용하기

개발 시에 다양한 웹서버에 대한 자원에 접근하기 위해 일시적인 방안으로 Cross Domain 접근을 허용할 필요가 있습니다. 이에 대해 각 웹서버에서의 방법이 상이한데요. 이에 대해 정리해 봅니다.

IE Express

IE Express가 실치된 Program Files(x86)/IIS Express/AppServer 폴더 안에 존재하는 applicationhost.config 파일에서 <customHeaders/> 부분에 <add name=”Access-Control-Allow-Origin” value=”*” />와 <add name=”Access-Control-Allow-Headers” value=”Content-Type” />를 추가합니다. 예를 들어 아래와 같습니다.

<httpProtocol>
    <customHeaders>
        <clear/>
        <add name="X-Powered-By" value="ASP.NET"/>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
    </customHeaders>
    <redirectHeaders>
        <clear/>
    </redirectHeaders>
</httpProtocol>

NGINX

NGINX가 설치된 폴더 안에 conf/nginx.conf 파일에서 ‘location /’ 부분의 블럭에 ‘add_header ‘Access-Control-Allow-Origin’ ‘*’;’ 추가합니다. 예를 들어 아래와 같습니다.

location / {
    #root   html;
    root e:/;
    add_header 'Access-Control-Allow-Origin' '*';
    index  index.html index.htm;
}