Download
1 / 26
260 likes | 414 Views
CGI (Common Gateway Interface). Mi-Jung Choi Department of Computer Science Kangwon National University, Korea. CGI 개요 (1/2). Common Gateway Interface. CGI 란 ? CGI 는 Common Gateway Interface 의 약어 무언가와의 Gateway 역할 ?
E N D
CGI(Common Gateway Interface) Mi-Jung Choi Department of Computer Science Kangwon National University, Korea
CGI 개요 (1/2) Common Gateway Interface • CGI란? • CGI는 Common Gateway Interface의 약어 무언가와의 Gateway 역할? • 사용자가1) 브라우저를 통해 입력한 정보가 웹 서버를 거쳐2) 응용프로그램에 전달되고 가공되어3) 다시 사용자에게 전달되기까지의 인터페이스 • HTML과 사용자 사이의 상호 작용 및 피드백을 가능하게 하는 강력한 웹 문서 교환 방식 • 외부 프로그램과 웹 서버(Web Server) 간의 연결 역할
CGI 개요 (2/2) Common Gateway Interface • 사용 이유 • 웹에서 데이터 전달의 양방향성(Input, Output)을 가능하게 함 • 웹 사용자와 서버 사이의 Interface가 가능한 웹 페이지 제작 • CGI 프로그램의 사용 예 • 방문객 카운터, 방명록, 사용자 ID 및 비밀번호 확인 • 웹 게시판, 웹 대화방, 자료실(uploading 포함) • 검색엔진, …
CGI 동작 절차 Common Gateway Interface 사용자가 브라우저 안에 입력한 내용을 웹 서버로 보낸다. 서버는 입력을 CGI 프로그램을 (스크립트로) 보낸다. 즉, 서버는 CGI를 호출한다. CGI 프로그램은 입력에 따른 처리를 수행하고, 그 결과를 웹 서버에게 전달한다. 웹 서버는 사용자의 브라우저, 즉 클라이언트에게 CGI의 실행 결과를 출력한다.
CGI 프로그램 vs. 일반 프로그램 Common Gateway Interface • 처리 방식 • 일반 프로그램 • 자체 시스템에서 실시간으로 실행됨 • 프로그램이나 데이터가 메모리에 상주 • CGI 프로그램 • 자료의 요청과 응답으로 이루어짐 • 요청에 대한 응답이 종료되면 실행이 종료 • 기동 방식 • 일반 프로그램은 해당 컴퓨터(서버든 클라이언트든)에서 자체의 목적에 의해 기동 • CGI프로그램은 클라이언트의 요청을 서버에서 수용할 수 있도록 하기 위해 만들어진 서버 종속용 프로그램
CGI 개발 도구 Common Gateway Interface • 제 1세대 • C/C++ • Perl • C Shell • 제 2세대 • ASP (Active Server Page) • JSP (Java Server Page) • PHP (Personal Home Page Tools) • 제 3세대 • ASP.NET • JSP+EJB
<FORM> 태그 (1/2) Common Gateway Interface • HTML 문서에서 정보 입력 방식, 정보 전달 방식, 실행할 CGI 프로그램의 위치 등을 지정하는 태그이다. • 기본 구조 <FORM> Form 시작 <INPUT> 여러 가지 방법 중 하나의 정보를 질의 <INPUT>원하는 만큼 사용 </FORM> Form 종료 • 속성(attribute) • action = “.…”서버로부터 데이터를 입력 받아서 동작할 CGI 프로그램을 지정
<FORM> 태그 (2/2) Common Gateway Interface • 속성(attribute) (계속) • action = “.…”서버로부터 데이터를 입력 받아서 동작할 CGI 프로그램을 지정 • method = GET or POST • 폼 데이터를 서버의 CGI 프로그램에 전달하는 방식을 지정 • GET: 환경 변수를 이용한 CGI 방법을 사용(데이터가 URL 주소에 포함되어 전송되며, 데이터 양이 많지 않은 경우에 유리함) • POST: 표준 입출력 방식(stdin)을 이용한 CGI 방법을 사용 (데이터가 HTTP 프로토콜 Header에 포함되어 전송되며, 데이터 많은 경우에 유리함) • target = “...”결과를 나타낼 창을 지정 (_blank, _self, _parent, _top): 새로운 창, 현재 창 등등
<FORM> 태그 사용 예제 Common Gateway Interface form1.html
<INPUT> 태그 (1/2) Common Gateway Interface • 태그 형식: <INPUT type="입력양식 형태" name="입력양식 이름"> • 간단한 텍스트의 입력, 체크박스(check-box), 라디오 박스(radio-box), 버튼 등의 사용자 인터페이스를 지원 • 속성 form2.html • 텍스트 입력 양식 <INPUT type = "text" name = "....">사용자로부터 한 줄 짜리 문자열을 입력받기 위해 사용하는 형식 • 암호 입력 양식 <INPUT type = "password" name = "....">사용자가 입력한 글자들은 “*”로 표시 • 라디오 버튼 양식 <INPUT type = "radio" name = "...." value="버튼글자”>사용자에게 선택할 수 있는 목록들을 나열해 주고 한 가지만 선택 • Submit 버튼 양식 <INPUT type = "submit" name = "...." value="버튼글자”>입력한 모든 데이터를 <FORM> 태그의 action 속성에서 지정한 URL로 보내는 역할
<INPUT> 태그 (2/2) Common Gateway Interface • 속성 (계속) • Reset 버튼 양식 <INPUT type = "reset" name = "...." value=“value”><FORM> 안에 있는 모든 양식들의 값을 각 양식의 value 속성에서 정한 값으로 초기화 • 체크 박스 양식 <INPUT type = "checkbox" name = "....">사용자에게 선택할 수 있는 목록들을 나열해 주고 선택하도록 하는 입력 양식 (여러 개 동시 선택 가능) • 이미지 입력 양식 <INPUT type = "image" name = "....">HTML 문서에서 입력 양식으로 이미지를 사용할 수 있으며, 지정한 이미지를 누르면 Submit 버튼처럼 동작한다. • 숨겨진 입력 양식 <INPUT type = "hidden" name = "...." value="숨겨진 양식 값>사용자 화면에 보이지 않고 스크립트로 전송되는 필드이다.
<INPUT> 태그 사용 예제 (1/2) Common Gateway Interface
<INPUT> 태그 사용 예제 (2/2) Common Gateway Interface
<SELECT> 태그 Common Gateway Interface 태그 형식: <SELECT name=“리스트명" <option> … </SELECT> 클라이언트에서 선택할 수 있는 항목을 리스트(목록) 형태로 제공할 수 있는 사용자 인터페이스 제공 클라이언트는 제공된 리스트의 여러 항목들 중 하나를 선택 사용 형식 form3.html <SELECT name = "리스트 이름”> <option> 항목-1 <option> 항목-2 : : <option> 항목-n </SELECT> 속성: SIZE, NAME, MULTIPLE
<SELECT> 태그 사용 예제 (1/2) Common Gateway Interface
<SELECT> 태그 사용 예제 (2/2) Common Gateway Interface
<TEXTAREA> 태그 Common Gateway Interface 태그 형식:<TEXTAREA name=“입력필드명" rows=“…” cols=“…” </TEXTAREA> 일반적인 텍스트를 입력 받을 때, 한 줄이 아닌 여러 줄의 텍스트 입력이 필요한 경우에 사용하는 인터페이스 사용 형식 <TEXTAREA name = “content” rows=“4” cols=“8”> 초기 입력 내용 </TEXTAREA> 속성: NAME, ROWS, COLS
<TEXTAREA> 태그 사용 예제 Common Gateway Interface
Input to CGI Program (1/2) Common Gateway Interface Simple Form의 예제 (Client Side) form4.html <HTML> <HEAD><TITLE> Simple Form </TITLE></HEAD> <BODY> <H1> 간단한 Form </H1> <HR> <FORM action=“/cgi-bin/ex1.pl” method=“GET”> Command <Input Type=“text” Name=“command” SIZE=10> <BR> <Input Type=“submit” Value=“submit”> <Input Type=“reset” Value=“clear”> </FORM> <HR> </BODY> </HTML>
Input to CGI Program (2/2) Common Gateway Interface GET을 사용하는 경우 (REQUEST_METHOD == “GET”) #!/usr/local/bin/perl print “Content-type: text/plain”,”\n\n”; $query_string = “ENV{‘QUERY_STRING’}; • GET을 이용하여 정보를 얻는 경우, URL에 붙는 데이터는 Encoding되어 전달된다. • 특수문자와 한글 코드에 대해서는 %xx(xx 는 16진수)로 변환 • 인코딩된 데이터의 예 • Space %20 (since ASCII code value of space is 20.) • 한글의 경우(한글 = %C7%D1%B1%DB) POST을 사용하는 경우 (REQUEST_METHOD == “POST”) #!/usr/local/bin/perl $size_of_form_information = $ENV{‘CONTENT_LENGTH’}; read(STDIN, $form_info, $size_of_form_information);
Output from CGI Program Common Gateway Interface • Simple Document를 출력할 수 있다. • Plain Text • HTML Document • 그림 혹은 그외의 이진 데이터(영상, 소리, 등등)를 출력할 수 있다. • Client에게 HTTP Status Code를 보낼 수 있다. • Server에게 특정 Document를 Client에게 보내도록 지시할 수 있다. • Decoding Process • Request Protocol 확인 (REQUEST_METHOD가 POST인지 GET인지...) • GET인 경우, Query를 QUERY_STRING에서 읽어 들이고, PATH_INFO를 참조 • POST인 경우, Request의 길이를 CONTENT_LENGTH에서 읽어 들인 후,Request를 표준입력 Data Stream에서 읽어 들인다. • Query String을 “&”단위로 잘라내고 해석 (key=value&key=value...) • Hexadecimal 및 Character를 해석
CGI 예제 (Hello World!) Common Gateway Interface 상황: UNIX 상에 Web Server가 있는 경우, 다음과 같이 C 프로그램을 작성한다. 작성한 C 프로그램을 Compile한다. ($ cc –o hello.cgi hello.c) CGI 프로그램 “hello.cgi”를 Web Browser에서 실행시켜 본다. http://cs1.kangwon.ac.kr/~ysmoon/cgi-bin/hello.cgi #include <stdio.h> #include <stdlib.h> void main(int argc, char *argv[]) { printf("Content-type: text/plain\n\n"); printf("Hello Wordl!"); }
CGI 예제 (폼 데이터 그대로 전송) (1/4) Common Gateway Interface Web Browser 입력 상황 • 폼 데이터 크기 알아내기 • CONTENT_LENGTH 환경변수를 정수로 변환 • int n = atoi(getenv(“CONTENT_LENGTH”)); • 폼 데이터 읽어들이기 • for(i=0; i<n; i++) contentBuffer[i] = getchar(); • 브라우저로 출력하기 • for(i=0; i<n; i++) printf(“%c”, contentBuffer[i]); • 브라우저로 출력하기 전의 필수 코드 • printf(“Content-type: text/html\n\n”); • HTML임을 알리는 표시
CGI 예제 (폼 데이터 그대로 전송) (2/4) Common Gateway Interface /* cgitest1.c - Echo request in a raw form */ #include <stdio.h> #include <stdlib.h> char *GetContent(int*); void ReleaseContent(char*); void EchoReqHeader(char*, int); void main() { char *ContentBuffer; int n; ContentBuffer = GetContent(&n); printf("Content-type: text/html\n"); printf("\n"); printf("<html><head><title>aa</title></head>"); printf("<body><h1>CGI Program “); printf(“responds as follows</h1>"); printf("<hr noshade>"); printf("<h1>Request Header</h1>"); printf("Content-Length=%d\n", n); EchoReqHeader(ContentBuffer, n); printf("</body></html>"); ReleaseContent(ContentBuffer); }
CGI 예제 (폼 데이터 그대로 전송) (3/4) Common Gateway Interface char *GetContent(int *n) { char *ContentBuffer; int i; *n = atoi(getenv("CONTENT_LENGTH")); ContentBuffer = (char *)malloc(*n+1); for (i=0; i<*n; i++) ContentBuffer[i] = getchar(); ContentBuffer[i] = 0; return(ContentBuffer); } void ReleaseContent(char *buf) { free(buf); } void EchoReqHeader(char *ContentBuffer, int n) { int i; for (i=0; i<n; i++) putchar(ContentBuffer[i]); }
CGI 예제 (폼 데이터 그대로 전송) (4/4) Common Gateway Interface void SendNameValue(char *ContentBuffer, int n) { int i; for (i=0; i<n; i++) { if (ContentBuffer[i] != '&') putchar(ContentBuffer[i]); else printf("<br>"); } }
