1 / 40

8 장 . FORM 과 CGI

8 장 . FORM 과 CGI. CGI 란 무엇인가 ? 웹서버와 CGI 프로그램간의 자료교환 CGI 디버깅 폼 (FORM) 폼 만들기 CGI 라이브러리 예제 프로그램 CGI 와 FORM 관련 사이트. 8.1 CGI 란 무엇인가 ?. CGI 란 ? 웹 서버나 HTTP 등 정보를 제공하는 서버와 응용프로그램들과의 인터페이스 표준 CGI 프로그램은 호출될 때마다 실행되어 결과를 만들기 때문에 동적인 결과

sine
Download Presentation

8 장 . FORM 과 CGI

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. 8장. FORM과 CGI • CGI란 무엇인가? • 웹서버와 CGI 프로그램간의 자료교환 • CGI 디버깅 • 폼(FORM) • 폼 만들기 • CGI 라이브러리 • 예제 프로그램 • CGI와 FORM 관련 사이트

  2. 8.1 CGI란 무엇인가? • CGI란? • 웹 서버나 HTTP 등 정보를 제공하는 서버와 응용프로그램들과의 인터페이스 표준 • CGI 프로그램은 호출될 때마다 실행되어 결과를 만들기 때문에 동적인 결과 • CGI는 웹 서버에 동적인 기능을 부여하는 여러 방법들(CGI, Java, JavaScript, JDBC, ActiveX, ...)중의 하나 • 가장 고전적인 방법

  3. 8.1 CGI란 무엇인가? • CGI를 사용하는 장단점 • 검색 서비스나 방명록 등 사용자의 입력을 요구하는 문서들은 CGI 프로그램을 호출하도록 작성

  4. 8.1 CGI란 무엇인가? • CGI 프로그램은 웹 서버를 통하여 실행 • 보안이 중요 • CGI 프로그램들을 위한 디렉토리로 지정 • 디렉토리에 존재하는 파일이 요구되었을 때 파일의 내용 대신 실행결과를 돌려줌 • 일반 사용자가 쉽게 CGI 프로그램을 작성하여 사용하지 못함 • NCSA나 Apache의 웹 서버를 사용하는 경우 • Apache가 설치된 디렉토리의 "etc"라는 하위 디렉토리의 "srm.conf"파일을 사용하여 CGI 프로그램의 위치를 지정 • srm.conf의 일부로서 /cgi-bin/이란 가상경로를 /usr/local/ apache/share/cgi-bin/이란 절대경로에 연결

  5. 8.1 CGI란 무엇인가? • CGI 프로그램은 실행 가능한 프로그램 • 웹 서버가 구동되고 있는 컴퓨터에서 실행될 수 있는 모든 언어로 작성 • C/C++, Fortran, Pascal, PERL, TCL, Unix shell, Visual Basic, AppleScript. • 자신에게 익숙한 언어를 사용하여 작업 • C/C++, Fortran 등의 고급어로 작성된 프로그램은 실행되기 위해 미리 컴파일 필요 • PERL, TCL, Unix shell 등의 스크립트 언어는 별도의 컴파일 과정이 필요 없음 • 프로그램의 작성과 유지, 보수가 간편 • 컴파일 언어에 비하여 실행속도가 느리다는 단점

  6. 8.2 웹서버와 CGI 프로그램간의 자료교환 • CGI 환경변수 • 웹 서버와 CGI 프로그램 사이에 정보교환의 수단 • SERVER_SOFTWARE: 서버 프로그램의 이름과 버전 • SERVER_NAME: 서버의 도메인이름이나 IP 주소를 표시 • GATEWAY_INTERFACE: 서버 프로그램에서 사용하는 CGI의 버전. • SERVER_PROTOCOL: 서버 프로그램에서 사용하는 프로토콜의 이름과 버전 • SERVER_PORT: 서버 프로그램에서 요청을 받는 포트 번호. 예) 80 • REQUEST_METHOD: CGI 요청의 종류. HTTP의 경우에 GET, HEAD, PUT 등 • PATH_INFO: 요청된 URL의 상대적 디렉토리 • PATH_TRANSLATED: PATH_INFO의 절대 경로 • SCRIPT_NAME: 실행될 CGI 프로그램의 가상경로

  7. 8.2 웹서버와 CGI 프로그램간의 자료교환 • QUERY_STRING: CGI 요청이 GET인 경우에 질의 문자열을 저장 • REMOTE_HOST: CGI를 요청한 호스트의 도메인 이름 • REMOTE_ADDR: CGI를 요청한 호스트의 IP 주소 • AUTH_TYPE: CGI에서 사용자 인증이 필요하고 서버가 사용자 인증을 지원하는 경우 인증 형식 • REMOTE_USER: AUTH_TYPE에 의해 인증된 사용자 이름 • REMOTE_IDENT: 서버가 RFC 931의 인증을 사용할 때 인증된 원격 사용자 이름 • CONTENT_TYPE: CGI 프로그램에 전달되는 자료의 인코딩 형식 • CONTENT_LENGTH: CGI 프로그램에 전달되는 자료의 길이 • HTTP_ACCEPT: 콤마로 분리된 클라이언트에서 받아들일 수 있는 MIME 형식들 • HTTP_USER_AGENT: CGI를 요청한 클라이언트의 브라우저의 종류 및 버전 • HTTP_COOKIE: 클라이언트에 설정된 쿠키 값을 가짐

  8. 8.2 웹서버와 CGI 프로그램간의 자료교환 • 웹서버에서 CGI에 자료 전달 • GET • 브라우저의 URL 작성란에 직접 CGI 프로그램을 기입하거나, 문서에서 앵커를 누르거나, 폼을 가진 문서에서 호출하는 방식 • QUERY_STRING이란 환경변수를 통하여 자료를 전달 • URL에서 CGI 프로그램 이름 다음의 "?"부호 뒤의 내용 • <FORM> 태그나 <ISINDEX> 태그에 의해 만들어진 내용 • 앵커(<A>) 태그에 직접 작성한 내용 • 운영체제에 따라 환경변수가 가질 수 있는 문자열의 최대 길이 • 1024 바이트, 혹은 4096 바이트 정도의 고정된 길이 • 폼을 사용하지 않는 경우에 질의 • CGI 프로그램의 명령행 인수로 전달 • 예)질의가 "hello world"인 경우 argv[1]은 "hello", argv[2]는 "world"

  9. 8.2 웹서버와 CGI 프로그램간의 자료교환 • POST • 많은 양의 자료가 CGI 프로그램에 전달되어야 하는 경우 • QUERY_STRING이란 환경 변수대신 표준입력을 통하여 자료를 읽어들임 • CONTENT_TYPE과 CONTENT_LENGTH라는 환경변수 사용 • GET과 같은 방식으로 폼에 포함된 자료들을 전달 • CONTENT_TYPE은 "application/x-www- form-urlencoded“ • <FORM> 태그의 ENCTYPE을 사용하여 자료의 인코딩 형식을 바꿈 • 예)폼을 사용하여 파일을 서버에 보내려면 ENCTYPE을 "multipart/form-data"로 지정 • CONTENT_LENGTH는 표준입력으로 전달되는 자료의 총 길이 • 일반적으로 파일의 끝에는 EOF(파일의 끝)표식이 붙어 있어서 파일의 마지막임을 표시 • CGI 프로그램에 표준입력을 통하여 전달되는 자료에는 EOF표식이 없으므로 CONTENT_LENGTH의 값만큼만 읽음

  10. 8.2 웹서버와 CGI 프로그램간의 자료교환 • 인자값의 인코딩 • 웹 서버에서 특별한 용도로 사용되는 문자 • 클라이언트 프로그램은 해당 문자에 대한 16진수 표현을 사용 • 클라이언트 프로그램에서 CGI 응용 프로그램을 직접 호출 • 사용자는 위의 문자들을 사용하여 CGI에 인자값들을 전달 • 예)야후 코리아(www.yahoo.co.kr)에서 "CGI"라는 키워드를 가진 문서를 검색 • 해당 작업을 수행하는 CGI프로그램(http://search.yahoo.co.kr/bin/search)과 응용프로그램과 인자값을 분리하기 위한 "?", 그리고 항목이름(p)와 "=", 마지막으로 검색어 (CGI)를 입력 • http://search.yahoo.co.kr/bin/search?p=CGI

  11. 8.2 웹서버와 CGI 프로그램간의 자료교환 • CGI에서 클라이언트에 결과 전달 • 표준출력을 통하여 웹서버가 인식할 수 있는 형태의 결과를 보내는 일 • CGI 프로그램의 결과 • 이미지, HTML 문서, 텍스트 문서, 오디오 등 다양한 매체 • 결과의 종류나 부수적인 정보를 위한 헤더와 결과의 내용으로 구성 • 헤더와 내용을 구분하기 위해 공백 문자열 한 줄을 사용 • 헤더의 주된 임무는 바로 결과의 종류를 서버에 알림 • 헤더의 첫 번째 줄에 결과의 종류를 Multi-purpose Internet Mail Extensions(MIME) 타입을 사용하여 문자열로 표시 • MIME이란 전자우편을 보낼 때 사용하는 방법이었으며 CGI에서도 채택

  12. 8.2 웹서버와 CGI 프로그램간의 자료교환 • 대표적인 MIME 타입 • Application • 특정 응용 프로그램에서 처리되는 포맷 • applicaton/pdf PDF 파일 • application/postscript PostScript 파일 • Audio • 오디오 파일 포맷 • audio/basic AU나 SND포맷 • audio/x-wav 윈도우즈의 WAV포맷 • Image • 이미지 파일 포맷 • image/gif GIF 포맷의 이미지 • image/jpeg JPEG 포맷 이미지

  13. 8.2 웹서버와 CGI 프로그램간의 자료교환 • multipart • 하나의 결과가 여러 개의 포맷을 담고 있는 경우에 사용 • multipart/x-zip PKZIP 압축 포맷 • multipart/x-gzip GNU ZIP 압축 포맷 • text • 텍스트 데이터로 가장 자주 사용되는 MIME 타입 • text/plain 일반 텍스트 • text/html HTML 포맷의 텍스트 • video • 비디오 파일 포맷 • video/mpeg MPEG 비디오 포맷 • video/quicktime QuickTime 비디오 포맷

  14. 8.2 웹서버와 CGI 프로그램간의 자료교환 • HTML 문서를 생성하는 CGI 프로그램의 출력 • CGI의 결과가 다른 문서의 참조인 경우에는 클라이언트에서 해당 CGI에서 참조한 문서를 호출한 것처럼 동작 • 헤더에 문서의 종류를 기술하는 대신 "Location" 필드를 사용하여 해당 문서를 지정 Location : 공백 : 헤더의 끝임을 웹 서버에 알린다.

  15. 8.2 웹서버와 CGI 프로그램간의 자료교환 • 예제 : CGI에 전달되는 환경변수의 출력 • C • C 언어에서 환경변수를 얻는 방법 • main() 함수의 인수를 사용하는 방법과 getenv() 함수를 사용하는 방법 main(int argc, char** argv, char** envp) { puts("content-type: text/plain"); /* 문서의 타입을 text/plain으로 */ while ( *envp ) puts(*envp++); } • 환경변수와 관계된 함수 • getenv와 putenv • getenv는 특정 환경변수의 내용을 얻을 때 사용 • putenv는 새로운 환경변수를 환경변수에 추가하고자 할 때 사용 char *getenv(const char *환경변수명); int putenv(const char *환경변수문자열);

  16. 8.2 웹서버와 CGI 프로그램간의 자료교환 • PERL #!/usr/bin/perl <- perl인터프리터의 위치 print "content-type: text/html"; while ( ($key, $val) = each %ENV ) { print "$key = $val<BR>"; } • 특정 환경변수의 값을 사용하려면 $ENV‘환경변수명’을 사용 • $ENV는 환경변수명에 해당하는 내용을 문자열로 반환 • 쉘 스크립트 #! /usr/bin/sh <- 쉘의 위치 echo "content-type: text/html“ echo env <- 환경변수들을 출력하는 명령어 • 특정 환경변수의 값을 사용하려면 $환경변수명을 사용 • $환경변수명은 해당 변수명의 내용을 문자열로 반환

  17. 8.3 CGI 디버깅 • 에러는 웹 서버를 통해 클라이언트에 전달되므로 정확한 오류의 원인을 파악하는 데 어려움 • 웹 서버에서 클라이언트에 전달하는 대표적인 에러 • Internal Server Error • 웹 서버에서 메모리 부족 등의 이유 • CGI 프로그램이 비정상적으로 종료 • MIME 헤더와 내용을 구분하기 위한 개행문자를 생략한 경우 • Document contains no data • MIME 헤더를 출력한 후에 내용을 보내지 않은 경우

  18. 8.3 CGI 디버깅 • Forbidden • 웹 서버가 해당 프로그램에 대한 실행권한이 없을 때 발생 • 유닉스의 경우 • 실행 가능한 파일과 가능하지 않은 파일의 구분을 파일의 속성을 사용 • 파일의 속성에는 읽기, 쓰기, 실행의 속성 • 파일의 소유자, 그룹, 다른 사람에 대하여 각각 다르게 지정 • 프로그램을 실행을 위해서는 파일의 실행 속성을 지정 • "chmod"란 명령을 통하여 파일의 속성을 변경

  19. 8.3 CGI 디버깅 • 쉘 상에서의 CGI 응용 프로그램 테스트 • 요청방법이 GET인 경우 • 환경변수는 REQUEST_METHOD가 GET으로 설정 • QUERY_STRING을 통해 인자 값이 전달 • 쉘 상에서 두 환경변수의 값을 적절히 설정 • CGI 프로그램을 직접 실행하여 CGI 프로그램의 출력을 확인 • %setenv REQUEST_METHOD GET • %setenv QUERY_STRING "queryString“ • %cgi프로그램

  20. 8.3 CGI 디버깅 • 요청방법이 POST인 경우 • 사용하는 환경변수는 REQUEST_METHOD가 POST로 설정 • 인자값은 표준입력을 통해 전달 • REQUEST_METHOD를 POST로 설정 • 인자값을 저장하고 있는 파일을 만든 후에 파일의 크기를 CONTENT_LENGTH에 설정 • 해당 CGI 프로그램을 실행할 때 리디렉션 연산자("<")를 사용 • 파일의 내용을 CGI 프로그램의 표준입력에 전달함으로써 프로그램의 결과를 화면에서 확인 • % // vi 등의 편집기를 사용하여 cgi프로그램의 표준입력으로 사용될 파일을 생성(예 a.txt ) • %setenv REQUEST_METHOD POST • %setenv CONTENT_LENGTH 파일크기 • %cgi프로그램 < a.txt

  21. 8.4 폼(FORM) • 클라이언트와 서버사이에 자료교환을 위해 방법 • 여러 입력 요소로 구성된 양식을 웹 문서에서 구현 • 클라이언트에서 서버에 데이터를 보내는 데 주로 사용 • 클라이언트에서 보내진 데이터는 보통 서버의 CGI프로그램에 전달되어 처리되고 처리 결과는 다시 클라이언트에 전송 • 폼은 다음과 같은 곳에서 사용 • 검색 사이트에서 사용자의 질의어 입력받기 • 전자 상거래에서의 주문 양식 등의 입력 • 입사지원서 작성 • 방명록 작성 • 사용자 등록양식 작성

  22. 8.4 폼(FORM) • 폼 태그 • ACTION=action • 폼이 제출(submit)될 때 연결될 문서의 URL을 기술 • NAME=name • 폼의 이름을 기술 • METHOD=GET | POST • 폼의 ACTION이 CGI와 연결되었을 때 폼의 데이터를 보내는 방법을 기술 • GET은 QUERY_STRING이란 환경변수를 통해서, POST는 표준입력을 통해서 전송

  23. 8.4 폼(FORM) • ENCTYPE=mediatype • 폼의 부호화 형식을 기술 • 폼에서 특정 URL에 전달되는 내용들을 각각의 부분으로 나누어 전달하는 형식인 'mulipart/form-data‘ 와 연속된 하나의 자료로 전달하는 형식인 'application/x-www-form-urlencoded'이 주로 사용 • 'application/x-www-form-urlencoded'이 디폴트로 사용 • ONSUBMIT=function • 서버에 보내기 전 클라이언트에서 수행할 작업을 지정 • 일반적으로 스크립트 언어를 사용하여 만든 함수 연결 • 폼에 입력된 데이터가 적절한가를 검사 • TARGET=target • 폼의 제출 결과로 획득된 문서를 출력할 윈도우를 지정 • FORM구성요소 • 폼에 들어갈 여러 가지 구성요소를 기술 • 구성요소에는 텍스트 박스, 리스트 박스, 콤보박스등

  24. 8.4 폼(FORM) • 폼 구성요소 입력 • ALGN=TOP | BOTTOM | MIDDLE | LEFT | RIGHT • 구성요소의 정렬을 표시 • CHECKED • 처음 상태를 체크된 상태

  25. 8.4 폼(FORM) • MAXLENGTH=maxlength • 입력 문자의 최대 길이 • NAME=name • 구성요소의 이름 • SIZE=size • 구성요소의 크기 • SRC=src • 구성요소의 URL • STYLE=style • 구성요소의 스타일 • TYPE=type • 구성요소의 종류 • CHECKBOX, INPUT, FILE, RADIO, PASSWORD등 • VALUE=value • 폼이 제출될 때 구성요소가 가지는 값을 설정

  26. 8.4 폼(FORM) • 폼 구성요소의 종류 • 체크박스 ( <INPUT TYPE=CHECKBOX ...> ) • 선택되거나 선택되지 않는 두 개의 상태 • NAME 속성은 필드의 데이터를 식별하기 위하여 사용 • VALUE는 체크박스가 선택되었을 때 전달되는 값 • CHECKED는 체크박스의 처음 상태를 체크된 상태 • CGI와 연결되면 선택한 체크박스의 이름과 값을 "제출"시에 CGI에 전달

  27. 8.4 폼(FORM) • 숨김 ( <INPUT TYPE=HIDDEN ...> ) • 화면에 보이지 않는 필드 • 쿠키의 대용으로도 사용 • 이미지 ( <INPUT TYPE=IMAGE ...> ) • 사용자에게 이미지를 제시 • SRC속성을 사용하여 사용자에게 보일 이미지를 설정 • 사용자가 이미지 위에서 마우스를 누를 때마다 폼에 있는 구성요소의 값들과 이미지에서 마우스가 눌려진 위치 정보가 서버에 제출

  28. 8.4 폼(FORM) • 패스워드 ( <INPUT TYPE=PASSWORD ...> ) • 문자열 입력은 문자 대신에 '*'를 사용 • 비밀번호의 입력 등에 사용

  29. 8.4 폼(FORM) • 라디오 버튼 ( <INPUT TYPE=RADIO ...> ) • 여러 항목 중 하나를 선택 • NAME 속성은 필드의 데이터를 식별 • VALUE는 라디오 버튼이 선택 되었을 때 전달되는 값을 기술 • CHECKED는 라디오 버튼의 처음 상태를 체크된 상태

  30. 8.4 폼(FORM) • 리셋 버튼 ( <INPUT TYPE=RESET ...> ) • 폼에 입력된 내용을 모두 삭제 • 버튼의 문자열을 바꾸려면 VALUE 옵션에 원하는 문자열을 지정 • 제출 버튼 ( <INPUT TYPE=SUBMIT ...> ) • 폼의 데이터를 제출 • <FORM> 태그의 ACTION 속성에 주어진 내용을 수행 • 버튼의 문자열을 바꾸려면 VALUE 옵션에 원하는 문자열을 지정

  31. 8.4 폼(FORM) • 문자열 ( <INPUT TYPE=TEXT ...> ) • 사용자로부터 한 행의 문자열 입력을 받는 구성요소 • VALUE 옵션을 사용하여 초기값 • 선택 박스 ( <SELECT ...> )

  32. 8.4 폼(FORM) • 하나 이상의 행을 선택하기 위해서는 MULTIPLE 옵션을 사용 • 항목을 선택된 상태로 표시하려면 SELECTED 옵션을 사용 • MULTIPLE 옵션을 사용하여 shift 키나 control 키를 누른 상태에서 선택하고자 하는 항목을 마우스 누름 • 선택한 개수만큼 URL에 전달 • 위의 예제에 MULTIPLE 옵션을 지정하고 개, 고양이, 금붕어를 선택하고 제출하면 다음과 같은 내용이 URL에 전달 • QUERY_STRING=animal=a1&animal=a2&animal=a5 (

  33. 8.4 폼(FORM) • 텍스트 영역 ( <TEXTAREA ...> ) • 여러 행으로 구성된 문장을 입력

  34. 8.6 CGI 라이브러리 • CGI 라이브러리 • CGI 프로그램을 작성하는 경우에 반복적으로 필요한 여러 작업 • 함수나 객체들을 가지고 있는 CGI 프로그램 작성을 위한 라이브러리를 의미 • CGI 라이브러리가 담당하는 기본적인 일 • 폼 데이터 분석 • 폼을 통해 입력된 데이터들에 대하여 GET/POST 등의 방법에 상관없이 일관된 방법으로 접근 • 폼 데이터 접근 • 정수, 실수, 문자열, 콤보박스, 리스트박스 등 폼의 입력필드를 통해 전달된 값들에 접근

  35. 8.6 CGI 라이브러리 • 라이브러리를 사용함으로써 얻을 수 있는 장점 • 생산성 향상 • 필요한 프로그램을 빠르게 작성 • 여러 사람이 함께 하는 작업이라면 업무를 쉽게 분담 • 오류 최소화 • 검증된 라이브러리를 사용 • 중복작업 최소화 • 한번 했던 프로그램(코딩)을 다시 하지 않아도 됨 • 쉬운 유지 보수 • 프로그램에서 변경되어야 할 부분이 명확

  36. 8.6 CGI 라이브러리 • 라이브러리를 선택할 때 고려해야 할 사항 • 기능성 • 필요한 기능이 포함되어 있는가 • 예)클라이언트/서버 간 파일 주고받기, 클라이언트/서버 간 정보교환-쿠키- 등 • 편리성 • 얼마나 쉽게 배워서 사용할 수 있는가 • 정확성 • 많은 사람들에 의해 사용되고 있고, 검증된 라이브러리인가 • 쉬운 디버깅 • CGI 프로그램의 문제는 디버깅이 어렵다는 것이다. 어떤 CGI 라이브러리들은 디버깅을 쉽게 할 수 있는 방법을 제공

  37. 8.6 CGI 라이브러리 • CGI 라이브러리 설치 및 활용 • 압축파일의 형태로 제공되며 압축파일에는 원시 프로그램, 사용법, 설치방법 등이 들어 있음 • C용 CGI 라이브러리(cgic) • cgic는 ANSI C 컴파일러를 위해 작성된 CGI 라이브러리 • Unix뿐 아니라 DOS나 Window에서 사용 • "http://www.boutell.com/cgic/"에 접속하여 소스와 관련된 문서를다운로드

  38. 8.6 CGI 라이브러리 • cgic의 주요기능 • 폼 데이터 분석 및 오류 수정 • GET, POST 방법에 대한 일관된 접근방법을 제공 • 폼의 입력필드에 포함된 개행문자의 일관된 처리 • 폼 입력필드의 문자열, 실수형, 정수형, 단일/다중 선택 등에 대한 접근 • 수치 데이터에 대한 바운드 체크 • CGI 환경변수들을 C의 문자형 데이터로 로드 • CGI 디버깅을 쉽게 하기 위해 환경변수들을 파일로 저장

  39. 8.6 CGI 라이브러리 • cgic의 설치요령 • 압축 해제 : Unix : % uncompresscgic106.tar.Z % tar -xvfcgic106.tar DOS : > pkunzip /d cgic106.zip • 컴파일 : • make 유틸리티를 사용하여 라이브러리 파일을 만듬 • Unix의 경우 gcc를 보통 사용하고 DOS나 윈도우즈에서는 대부분의 컴파일러가 ANSI표준을 따르므로 컴파일에 별 문제가 없음 Unix, DOS : > cdcgic106 > make (gcc컴파일러를 사용하는 경우), DOS의 경우에는 파일의 확장자와 컴파일과 관련된 실행프로그램의 이름 이 다르므로 Makefile을 변경

  40. 8.6 CGI 라이브러리 • 생성되는 파일 • libcgic.a • 라이브러리 파일. 사용자의 소스파일과 링크하여 실행파일을 생성 • Capture • 전달된 환경변수들을 특정 파일에 저장하는 샘플 프로그램 • Cgitest • capture에 의해 파일에 저장된 값들을 읽어서 HTML로 출력

More Related