이 강좌는 계간 에듀넷과의 집필 계약에 의하여 작성된 것입니다.
운영자의 동의가 없는 무단 사용을 금합니다.

  지난 호에서 학생들의 감각에 맞는 학교홈페이지 초기화면 디자인하기를 배워보았다. 학생들이 자신이 다니는 학교홈페이지에 자주 접속하지 않는 이유는 간단하다. '재미'가 없기 때문이다. 몇 달이 지나도록 업데이트되지 않고 방치되어 있거나 글을 올려도 도무지 응답이 없으니 그만 흥미를 잃어버리고 오락이나 게임사이트를 찾아다닌다. 한마디로 활력이 없으면 '주고객'인 학생들의 발길이 뜸해질 수밖에 없는 것이다. 그래서 이번에는 학교 홈페이지에 활력을 불어넣는 요소들을 직접 설치해보기로 한다. 웹 페이지에 상호작용을 더하는 것으로 널리 쓰이는 기법은 CGI(Commom Gateway Interface)와 ASP(Active Server Page)가 있다. CGI는 동적인 웹사이트 구축을 위해서는 필수적인 요소이며 서버기종에 따라 다양하게 설치하여 사용할 수 있다. 현재 인터넷에서 제공되고 있는 대부분의 게시판, 검색엔진, 자료실 등이 CGI기법을 이용하여 구현되고 있다. ASP는 데이터베이스 연동 부분에서 강한 성능을 발휘한다. 그러나 CGI의 쓰임새만큼 대중화되어 있지는 못한데 Windows NT서버에서 작동을 하는 탓이다. 현재 학교 홈페이지가 올려져 있는 서버는 Unix계열의 서버가 많고, NT서버를 사용하고 있는 학교들도 비용문제와 사용상의 편리함으로 Unix계열의 서버로 교체하고 있는 것으로 알려져 있다.  따라서 이제 다루어 보고자하는 몇 개의 요소들은 Unix기반의 서버를 기준으로 설명하도록 하겠다.  

  그런데 학교 홈페이지 관리교사가 프로그램 분야에 능력이 없고, 그저 html문서 정도만을 다루는 정도라면 어렵지 않겠느냐는 반문이 있을 법하다. 이제 공부할 CGI요소의 설치는 프로그램을 전혀 모르더라도 html을 다루는 기본만 알고 있으면 누구나 쉽게 활용할 수 있다. 한가지씩 따라해 보면서 시험을 해보고 차차 좀더 고난도의 요소설치법을 공부하면 될 것이다.     

1. 로컬검색엔진을 설치하자.

<그림 1> 로컬검색엔진이 설치된 모습  

심마니, 야후, 네이버와 같은 것들이 검색엔진의 일종이라는 것을 모르는 사람은 없을 것이다. 이러한 범용 검색엔진은 인터넷상에 광범하게 존재하는 자원을 뒤져서 분류, 정리하고 사용자의 요청에 따라서 보여준다. 그러므로 인터넷상에 있는 자료검색을 할 때에 더할 수 없이 좋은 도구이다. 그런데 우리학교 홈페이지 안에 있는 자료만을 대상으로 검색하여 보여줄 수 없을까라는 데에 관심이 미치면 아무리 훌륭한 검색엔진이라도 한계가 뚜렷하다. 이런 경우에 유용한 것이 바로 '로컬검색엔진'이다. <그림1>의 오른쪽 상단에 보이는 것은 필자의 홈페이지에 설치된 로컬검색엔진이다.

<그림 2>로컬검색엔진의 출력 결과  

왼쪽에는 키워드(검색어)를 입력하기 위한 검색창이 있고 오른쪽에 있는 것이 검색단추이다. <그림2>와 같이 '교육자료'라는 검색어를 검색창에 입력하면 사전에 정해놓은 검색조건에 따라 '교육자료'라는 단어나 문장이 들어간 웹페이지를 모두 출력한다. 사용자는 이곳에서 자신이 원하는 정보를 클릭하여 보다 빠르게 자료에 접근할 수 있다.

물론 지정된 하나의 홈페이지에서만 검색을 수행한다.  예제에서 사용된 검색엔진은 '봄넷'의 Way-cgi 시리즈 중의 하나로 http://bom.net에 접속하여 소스를 구할 수 있다.

1. 학교 홈페이지의 계정에 접속하여 루트 디렉토리(대개는 public_html) 밑에 cgi-bin이라는 하위 디렉토리를 생성한다. (mkdir cgi-bin)

2. way-srch.tar 파일을 cgi-bin 디렉토리에 업로드한다. Ws-Ftp등의 파일전송툴을 사용하면 쉽다.

3. $ cd public_html/cgi-bin하여 소스가 올려진 디렉토리로 이동한다. 압축을 풀어보도록 하자.

4. $ tar xvf way-srch.tar

  위와 같이 압축을 풀면 way-search라는 하위경로가 생성되고(~/cgi-bin/way-search) 파일들이 설치된다. 설치된 파일의 목록은 다음과 같을 것이다.

     search.html   - 검색화면으로 검색창과 옵션 및 검색단추가 있는 페이지이다.
     way-srch.cgi  - cgi 파일로 실제 검색기능을 수행하도록 코딩된 스크립트 문서이다.
     config.cgi   - 환경설정 파일로 사용자의 조건에 맞게 설정하는 파일이다.
     README   - 설명서 파일로 설치전에 충분히 숙지하도록 한다.

5. way-srch.cgi의 권한을 변경한다. 방법은 $ chmod 755 way-srch.cgi

6. whereis perl 또는 which perl 등의 명령을 수행하여 시스템에 설치된 perl 의 경로를 파악한다.

만약 perl의 경로가 /usr/bin/perl이 아니라면, vi나 pico 등으로 way-srch.cgi를 열어 첫번째 라인을 시스템의 perl경로로 수정한다. 예를 들어 시스템의 perl 경로가 /usr/local/bin/perl이라면

#!/usr/local/bin/perl로 way-srch.cgi의 첫번째 라인을 수정한다. (Windows 계열의 경우도 되도록 경로를 파악하여 적어주는 것이 좋다.)

7. config.cgi를 편집기로 열어 아래와 같은 코드가 나오는 행을 찾아서 수정한다.

        $dir_s  ='../';  

          검색경로로써  현재 실행하려는 CGI를 기준으로 경로를 지정한다.

          현재경로는 './' 이라고 표현하고,  상위는 '../' 로 표현한다.

        $dir_n  = '../cgi-bin';

           는 배제경로이다. 보안상 검색결과로 출력하는 곳에서 제외하고 싶은 디렉토리의 상대경로             를 입력한다.

        $target  = 'main'; (또는 _top, _blank, _self)  

           은 검색결과물의 기본 target을 지정하는 라인이다. 특히 프레임이 걸린 웹페이지에서는 본            문 페이지에 출력되도록 수정한다.

8. 여기까지 적절하게 수정이 되었다면 이제 검색엔진이 설치된 것이다. pico나 vi편집기의 사용이 어려운 사람들은 cgi파일을 PC로 다운 받아서 메모장 같은 편집기로 수정하고 다시 업로드하면 된다. 이때 확장자가 .cgi인 파일은 반드시 아스키모드로 전송해야 함에 유의한다.

9. 검색창을 보여주는 화면 search.html을 열어서

<FORM method="get" action="way-srch.cgi">부분을 찾는다. 에러가 난다면 대개 이곳에서 CGI경로가 잘못되었기 때문이다. CGI 파일이 search.html과 같은 경로라면 단순히 action="way-srch.cgi"라고 해주면 된다. 만약 경로가 다르다면 ./cgi-bin/way-search/way-srch.cgi 와 같이 상대경로로 기록하던지 상대경로 개념이 익숙하지 않은 사람은 http://edcom.co.kr/cgi-bin/way-search/way-srch.cgi 와 같이 절대경로로 기술한다.

<그림 4>성공적으로 설치된 검색엔진 화면  

10. 이제 search.html에 접속하여 보자. <그림4>와 같은 검색엔진이 보일 것이다. 검색어를 입력하여 실험해보고 에러를 교정하면 된다. 그런데 왼쪽 그림은 애초 예제에서 보았던 것과는 다르다. 예제에서는 단순히 검색창과 검색단추만 있어서 깔끔했었는데 이 상태로는 프레임을 사용한 페이지에 삽입하기가 힘들 것 같다. 예제에서와 같이 구현하려면 폼태그를 다소 수정해야 한다. html 서적 등을 참고하여 나름대로 수정해보기 바란다.