IT/모바일
제공: 한빛 네트워크
저자: Paul Sobocinski, 이대엽 역
원문: RSS and AJAX: A Simple News Reader
Ajax RSS 파서
Ajax(Asynchronous JavaScript And XML)와 RSS(Really Simple Syndication)는 웹을 매료시키는 두 가지 기술이다. 일반적으로 RSS는 사람 혹은 조직에 뉴스를 제공하기 위하여 사용된다. 이것은 웹 사이트로부터 "RSS 피드(feed)"를 공급받음으로써 이루어진다. RSS 피드는 단순히 특정한 방식으로 구조화되어 있는 XML 파일에 대한 링크일 뿐이다. RSS 스펙에는 XML 파일로 기대되는 구조로 나타나 있다. 예를 들어, 스펙에는 제목, 저자, 그리고 설명 태그를 필요로 하는데, 따라서 모든 RSS XML 파일은 최소한 이 3가지 태그를 가지게 된다.
여기에서 사용하게 될 RSS 스펙의 버전은 2.0인데, 가장 최신이며 3가지 RSS 스펙(0.98, 1.0, 2.0) 중 가장 널리 사용되고 있는 것이다. 다행히도, RSS 2.0은 RSS 1.0에 비해 훨씬 덜 복잡하므로 여러분은 아래에 링크되어 있는 RSS 2.0 스펙에 금방 익숙해질 것이다: blogs.law.harvard.edu/tech/rss. 만약 여러분이 RSS에 대한 포괄적인 소개를 원한다면 3가지 RSS 스펙을 모두 다루고 있는 아래 링크를 방문해 보라: www.xml.com/pub/a/2002/12/18/dive-into-xml.html
왜 RSS를 파싱하기 위해 Ajax를 사용할까? Ajax를 사용함으로써 웹 브라우저로 전달되는 RSS XML 파일을 처리하는 작업을 생략할 수 있는데, 따라서 서버의 부하를 줄일 수 있다. 또한 Ajax는 사용자로 하여금 좀 더 끊김 없는 웹 경험을 가질 수 있게끔 해주는데, 이는 서버로부터 전달받는 전체 RSS XML 파일을 페이지를 갱신하지 않고도 가져 올 수 있기 때문이다. 마지막으로 Ajax는 XML 파일을 처리할 수 있도록 설계되어 있으므로 RSS를 간단하고 우아한 방법으로 파싱할 수 있다.
이 기사 때문에 여러분이 Ajax에 익숙해질 필요는 없다. 하지만 기본적인 자바스크립트에 대한 이해는 강력히 권장한다.
아래에 파서가 어떻게 작동할 것인지에 대해 나와있다. 먼저 RSS 피드 파일명이 HTML form에서 선택된다. 사용자가 전송 버튼을 클릭하면 getRSS() 함수가 호출된다. 이 함수는 지정된 RSS XML 파일을 서버로부터 읽어오는 역할을 한다. 한번 서버로부터 읽어오는 것이 성공하면, processRSS() 함수가 전달받은 XML 파일을 자바스크립트 객체로 변환한다. 마지막으로 showRSS(RSS) 함수가 호출되는데, 이 함수는 RSS 자바스크립트 객체에 저장되어 있는 몇 가지 정보를 HTML 페이지를 갱신함으로써 보여준다. 아래의 도식은 이러한 일련의 단계들을 요약한 것이다.
그림 1. 전체적인 설계
HTML 파일
먼저 HTML 파일을 살펴볼 것이다. 위쪽의 폼 엘리먼트에 작성된 코드는 어느 RSS 피드를 읽어올 것인지를 결정하고, 아래쪽의 루트 div 엘리먼트에 작성된 코드는 RSS 자바스크립트 객체에 저장되어 있는 정보를 보여주기 위해 사용된다.
저자: Paul Sobocinski, 이대엽 역
원문: RSS and AJAX: A Simple News Reader
Ajax RSS 파서
Ajax(Asynchronous JavaScript And XML)와 RSS(Really Simple Syndication)는 웹을 매료시키는 두 가지 기술이다. 일반적으로 RSS는 사람 혹은 조직에 뉴스를 제공하기 위하여 사용된다. 이것은 웹 사이트로부터 "RSS 피드(feed)"를 공급받음으로써 이루어진다. RSS 피드는 단순히 특정한 방식으로 구조화되어 있는 XML 파일에 대한 링크일 뿐이다. RSS 스펙에는 XML 파일로 기대되는 구조로 나타나 있다. 예를 들어, 스펙에는 제목, 저자, 그리고 설명 태그를 필요로 하는데, 따라서 모든 RSS XML 파일은 최소한 이 3가지 태그를 가지게 된다.
여기에서 사용하게 될 RSS 스펙의 버전은 2.0인데, 가장 최신이며 3가지 RSS 스펙(0.98, 1.0, 2.0) 중 가장 널리 사용되고 있는 것이다. 다행히도, RSS 2.0은 RSS 1.0에 비해 훨씬 덜 복잡하므로 여러분은 아래에 링크되어 있는 RSS 2.0 스펙에 금방 익숙해질 것이다: blogs.law.harvard.edu/tech/rss. 만약 여러분이 RSS에 대한 포괄적인 소개를 원한다면 3가지 RSS 스펙을 모두 다루고 있는 아래 링크를 방문해 보라: www.xml.com/pub/a/2002/12/18/dive-into-xml.html
왜 RSS를 파싱하기 위해 Ajax를 사용할까? Ajax를 사용함으로써 웹 브라우저로 전달되는 RSS XML 파일을 처리하는 작업을 생략할 수 있는데, 따라서 서버의 부하를 줄일 수 있다. 또한 Ajax는 사용자로 하여금 좀 더 끊김 없는 웹 경험을 가질 수 있게끔 해주는데, 이는 서버로부터 전달받는 전체 RSS XML 파일을 페이지를 갱신하지 않고도 가져 올 수 있기 때문이다. 마지막으로 Ajax는 XML 파일을 처리할 수 있도록 설계되어 있으므로 RSS를 간단하고 우아한 방법으로 파싱할 수 있다.
이 기사 때문에 여러분이 Ajax에 익숙해질 필요는 없다. 하지만 기본적인 자바스크립트에 대한 이해는 강력히 권장한다.
아래에 파서가 어떻게 작동할 것인지에 대해 나와있다. 먼저 RSS 피드 파일명이 HTML form에서 선택된다. 사용자가 전송 버튼을 클릭하면 getRSS() 함수가 호출된다. 이 함수는 지정된 RSS XML 파일을 서버로부터 읽어오는 역할을 한다. 한번 서버로부터 읽어오는 것이 성공하면, processRSS() 함수가 전달받은 XML 파일을 자바스크립트 객체로 변환한다. 마지막으로 showRSS(RSS) 함수가 호출되는데, 이 함수는 RSS 자바스크립트 객체에 저장되어 있는 몇 가지 정보를 HTML 페이지를 갱신함으로써 보여준다. 아래의 도식은 이러한 일련의 단계들을 요약한 것이다.
그림 1. 전체적인 설계
HTML 파일
먼저 HTML 파일을 살펴볼 것이다. 위쪽의 폼 엘리먼트에 작성된 코드는 어느 RSS 피드를 읽어올 것인지를 결정하고, 아래쪽의 루트 div 엘리먼트에 작성된 코드는 RSS 자바스크립트 객체에 저장되어 있는 정보를 보여주기 위해 사용된다.
이제 나머지 대부분의 HTML 코드는 무시하기로 하고 로 표시되어 있는 폼 엘리먼트에 집중하기로 하자. RSS XML 파일의 이름은 select 엘리먼트의 option 태그의 value 속성으로 지정되어 있다. 사용자가 이러한 파일 가운데 하나를 선택하고 나면 폼이 전송된다. 전체 과정을 시작시키는 자바스크립트가 onsubmit 태그에 있는 것을 볼 수 있다. 자바스크립트 함수가 호출된 다음 폼 전체가 서버로 "틀에 박힌" 방식대로 전달되는 것을 막기 위해 false를 리턴하도록 return false 문장을 추가하였다. 만약 return false 문장을 생략했다면 전체 페이지가 갱신되면서 Ajax를 이용하여 읽어왔던 모든 데이터를 잃어버리게 될 것이다. 마지막으로 남은 하나는 로 표시된 부분에서 분리되어 있는 파일을 참조하도록 자바스크립트 코드가 헤더 부분에 포함되어 있다는 것이다. 여러분이 의아해 할 경우를 대비해서 설명하는 것이지만 로 표시된 부분에서