IE 8 Beta 2 Ajax 기능

2008.10.08 08:54 from [IT] Web Tech
Sunava Dutta씨가 XDR, XDM/postMessage, DOM 스토리지, 오프라인 검출 등의 Ajax 개발자를 위한 IE 8 beta 2의 확장 기능에 대해서 상세히 기술하셨습니다.

XDomainRequest(XDR)
이것은 클라이언트 사이드에서 크로스 도메인 호출을 보안성있고 쉽게 호출할 수 있도록 작성된 객체입니다. 의도하지 않은 크로스 도메인 접근을 줄이기 위해 이 객체는 클라이언트 스크립트와 서버로부터 크로스 도메인 호출에 대한 명시적인 허용를 요구합니다. 아울러, 사이트가 매시업을 위해  서드 파티의 스크립트를 직접 병합하는 위험한 방법에 대한 필요성을 감소시킵니다. 이런 방법은 서드파티에서 전체 DOM에 접근할 수 있기에 위험합니다. 이 모든 것들은 개선된 클라이언트 사이드 성능과 낮아진 서버 유지 비용으로 인해 프록시를 위한 서버군이 필요하지 않은 덕분에 가능했습니다.

Beta1 기간 동안에는 크로스 사이트 XMLHttpRequest와 Acesss Control 프레임웍을 사용하는 서드 파티 데이터의 크로스 도메인 접근과 관련한 많은 보안 정책들이 있었습니다. Beta1 때부터, 우리는 서버 사이드의 경험과 W3C의 Access Control 프레임웍의 보안을 개선하기 위해 다른 브라우저와 W3C 대면 회의의 참가자들과 함께 일할 기회를 가지게 되었습니다. 그 결과, 우리는 XDR을 클라이언트 상의 단순한 공용 서드파티 데이터 익명 요청에 대해 Access Control 영역의 문법과 지시문을 가진 명시적인 규약을 가지도록 업데이트 할 수 있었습니다(Access Control Process Model의 섹션 5.1.3).

Beta1의 XDR 업데이트로 인해 IE 8은 요청자의 직렬화된 출처값을 Origin 헤더로 전송하는 것으로 것으로 도메인의 서버로부터 데이터를 요청할 수 있게 되었습니다. IE8 Beta2 는 Beta1의 XDomainRequestAllowed:1 대신 Access-Control-Allow-Origin: *을 서버 응답으로 돌려받게 될 것입니다. 그 외 사항으로는 open 메소드에서의 상대 경로 지원과 HTTP와 HTTPS 로의 접근 제한이 있습니다.

Cross-document Messaging(XDM)
크로스 문서 메시징제가 이전에 블로깅했던 또 다른 강력한 크로스 도메인 기능입니다. 이 기능은 원격 웹 서비스에 백엔드 요청을 만드는 것보다는 사이트가 IFrame 기반으로 된 써드파티 "가젯"이나 컴포넌트가 동일출처정책(same site origin policy)을 불안전하게 위배하지 않고도 부모 문서와 직접 통신할 수 있도록 하는 것에 목적이 있습니다. 이것은 개발자들이 브라우저간에 서로 다른 방법에 의존하고 원하지 않는 부작용에 괴로워하지 않아도 되도록 함으로써 성능을 개선하고 신뢰성을 높이는 등의 장점이 있습니다. 이 기술은 또한 여러분의 페이지에서 서드 파티 스크립트를 포함할 필요가 없도록 만들어 민감한 데이터(소셜 네트웍 프로필 정보)가 여러분의 동의없이 서드 파티로 새나가는 것과 같은 잠재적인 정보 유출 취약성을 감소시킵니다.

Beta2 업데이트에서 onmessage 핸들러는 업데이트된 HTML 5.0 초안에 잘 맞도록 document 객체에서 window 객체로 옮겨졌습니다.
window.attachEvent("onmessage", HandleMessage);
또한 "scheme" + "호스트" + "기본이 아닌 포트" 의 직렬화된 형태인 e.URIe.origin으로 바꾸었습니다. 이는 수신측에서 허용 여부를 결정하는데 필요하지도 않는 민감할 수도 있는 정보를 출처 사이트로부터 URI를 통해  나르는 것보다 더 안전합니다.
if (e.origin == 'http://www.contoso.com')
{
    // 메시지 텍스트 처리
}
끝으로, HTML 5.0 초안에서 postMessage 메소드에서 targetOrigin 파라미터가 이전과 달리 필수 파라미터로 변경되었습니다. 이는 출처 <URL>이나 와일드카드 <*>를 지정함으로써 메시지의 목적지를 명시적으로 표시하도록 하는 것으로 개발자들이 에러를 덜 내도록 했습니다.
frameOther.postMessage("This is a message", "http://example.com");

DOM Storage
현재, 웹 페이지는 로컬 머신에 데이터를 저장하기 위해 document.cookie 속성을 사용하고 있습니다. 쿠키는 사이트가 도메인당 50개의 키/값의 쌍을 저장하지 못한다는 용량의 한계가 있습니다. 게다가, 쿠키 프로그래밍 모델은 귀찮고 데이터를 얻기 위해 쿠키 문자열을 파싱해야 합니다. 쿠키가 요청 헤더에 최대 4KB의 데이터를 함께 보내 서버로 클라이언트 상의 변화나 변동사항을 알려주는 것에 유용하긴 하지만, IE8은 클라이언트 상의 데이터를 영구적으로 유지할 때와 다른 탭에서 세션을 유지할 때를 대비한 보다 나은 대안을 제시합니다. W3C의 HTML 5 DOM 스토리지 객체가 그것으로, 키/값 쌍의 문자열 데이터를 위한 훨씬 간단한 전역과 세션 저장 모델을제공합니다. 사이트는 탭 또는 사이트가 살아있는 동안 혹은 사용자가 데이터를 제거할 때까지 데이터를 저장할 수 있습니다.

Beta2 업데이트에서는 영구 globalStorage 속성의 이름이 localStorage로 바뀌고, localStorage를 사용할 때 도메인 이름을 지정하지 않아도 되도록 했습니다.
// 키-값 쌍 저장.
localStorage.setItem("이름", "Sunava");
또한 저장소가 변경되었을 때 반환되는 업데이트된 onstorage HTML 5.0 이벤트를 개선했습니다. 지금은 로컬 저장소가 변경되면 URI를 반환하며 따라서 페이지의 핸들러는 저장 공간에 누가 마지막 트랜잭션을 보냈는지를 알 수 있고, 출처 창에 원본을 제공할 수도 있습니다. 더 좋은 소식은, HTML 5.0 Working Group이 우리가 Beta 1에 포함시켰던 clear 메소드를 초안에 포함시켰다는 것입니다. 이는 스크립트가 모든 키에 대해 반복하지 않고도 저장소의 접근할 수 있는 모든 데이터를 삭제할 수 있도록 합니다.

Connectivity Event
navigator.onLine 속성과 online/offline 이벤트는 현재 Windows XP/Vista에서 동작하고 있습니다. Windows XP의 접속 알림이 Windows Vista만큼 진보되어있지 않아서 이를 가능하게 하는 것이 쉬운 일은 아니었습니다. 즉, 이것은 우리가 OS 차이에 대해 걱정할 필요가 없다고 믿는 개발자들에게 많은 이점이 될 것입니다. 접속 이벤트의 값은 네트웍이 불가능한 경우에 데이터를 캐시하도록 localstorage와 연동해 사용될 때 매력적입니다.

XMLHttpRequest
IE8에서의 XDomainRequest 객체 도입을 했다고 해서 같은 도메인 상의 통신에 계속 사용될 객체인 XMLHttpRequest의 개선과 조정에 대한 우리의 관심이 사라진 것은 아닙니다. Beta1 이전의 에너지는 신뢰성을 위해 몇몇 버그를 수정하고, 초안 명세와 우리의 규약을 개선하고 명확하게 하기 위해 Web Apps Working Group과 작업하는 것에 집중되어 있었습니다. Beta1에서 개발자들의 편의를 위해 도입된 timeout 메소드는 현재 XMLHttpRequest 스펙에 적용되어 있습니다.
// Sets timeout after open to two seconds.
xhr.timeout = 2000;

ToStaticHTML, to JSON, and fromJSON
XDomainRequet나 Cross-document Messaging을 이용해 서드 파티로부터 받은 문자열로 무엇을 하시겠습니까? 오늘날 스크립트 인젝션과 크로스 사이트 스크립팅(Cross-site Scripting : XSS) 공격이 증가함에 따라 이들을 안전한 파서를 통해서 받는 방법이 환영받고 있습니다. Erix Lawrence씨가 IE 8 보안을 위한 Comprehensive Protection이라는 글에서 기술했듯이, toStaticHTML은 실행가능할 수 있는 컨텐트를 제거함으로써 문자열을 무해하게 만드는 강력한 방법을 제공합니다.
// Calling:
window.toStaticHTML("This is some <b>HTML</b> with embedded script following... <script>alert('bang!');</script>!");

// will return:
This is some <b>HTML</b> with embedded script following...!
추가로, IE8 Beta2의 toJSON과 fromJSON 메소드는 네이티브가 아닌 JavaScript 시리얼라이저와 디시리얼라이저에 비해 개선된 성능을 제공합니다. 구현체는 Douglas Crockford씨의 json2.js API를 사용한 네이티브 JSON 핸들링에 대한 ECMAScript 3.1 제안에 기반하고 있습니다. 네이티브라는 성능상의 이점외에도 JSON 파서는 eval() 메소드의 안전한 대안을 제공합니다. 이 메소드는 JSON 객체를 되살리는 일반적이고도 위험한 방법이어서, 임의의 스크립트 함수가 실행되도록 할 수 있었습니다.
From IE 8 beta 2 Ajax features

'[IT] Web Tech' 카테고리의 다른 글

alert()에게 작별을  (3) 2008.10.17
웹 에디터 비교  (4) 2008.10.14
iPhone in Action 일부 챕터 다운로드  (0) 2008.10.10
Pyjamas: Python을 위한 GWT  (0) 2008.10.08
IE 8 Beta 2 Ajax 기능  (0) 2008.10.08
JavaScript로 만든 팩맨  (0) 2008.09.20
iPhone에서도 SVG를 사용할 수 있습니다  (0) 2008.09.19
리눅스에서도 AIR를!!  (0) 2008.09.18
iPhone Web App: Spin the Bottle  (0) 2008.09.18
Posted by 행복한고니 트랙백 0 : 댓글 0

티스토리 툴바