CHAPTER 12

CHAPTER 12 응용계층과웹응용기법 New 데이터통신과네트워킹응용계층과웹응용기법 1/52

New 데이터통신과네트워킹응용계층과웹응용기법 2/52 12.1 응용계층과이메일시스템 12.4 자바와웹응용기법 12.2 응용계층 이메일시스템 이메일시스템의구성 우편함과가명확장 DHCP 기술 CGI 프로그램과자바 애플리케이션과자바애플릿 자바프로그램의특징 클래스의형식과정의 메소드 자바를이용한웹페이지작성 12.3 DHCP 란? DHCP 구조및동작 DHCP 기술 IP 대여재경신 웹과웹프로그래밍기법 12.5 HTML5 기술 HTML5 란무엇인가 HTML5 의특성 HTML5 의주요기술 새로운 API 웹과웹브라우저의기능 하이퍼텍스트전달프로토콜 (HTTP) HTML 을이용한웹페이지작성과동작 웹프로그램의동작

12. 1 응용계층과이메일시스템 응용계층 (application layer) 응용계층 : OSI 참조모델또는 TCP/IP 모델에서의최상위계층으로, 데이터통신을위한응용기능을제공 파일관리및전송같은 application 처리를위한프로세서사이의인터페이스기능을담당 ( 구분 ) 가상단말, 원격데이터베이스, 메일함접근기능등과같은자원이용기능과네트워크운영에필요한네트워크관리기능등으로구분 응용계층프로토콜및서비스 파일전송프로토콜 (FTP), 이메일전달프로토콜 (SMTP), 동적호스트구성프로토콜 (DHCP), 하이퍼텍스트전달프로토콜 (HTTP), 네트워크관리프로토콜 (SNMP), 도메인명서비스 (DNS), 원격로그인 (Telnet), 네트워크파일시스템 (NFS) 등 New 데이터통신과네트워킹응용계층과웹응용기법 3/52

12. 1 응용계층과이메일시스템 이메일시스템 이메일 (e-mail, electronic mail) 서비스 정보전송의신속성과편의성및활용도가매우높음 최근에는웹서비스를기반으로동작하는웹메일의형태로주로이용 이메일표준 -> 1982 년에이르러 RFC 821( 전송프로토콜 ) 과 RFC 822( 메시지형식 ) 발표 그후더욱발전된기능을갖춘 X.400 표준이발표 구조가복잡하고설계상의어려움으로인해실제적인구현은되지못함 RFC 821 과 RFC 822 표준은다소수정되어 RFC 2821 과 RFC 2822 표준으로발표 다른네트워크응용서비스와구별되는점 메시지전달의지연 (delayed delivery) 을허용한다는점 이메일의메시지는전화의음성메시지와는달리, 실시간으로전달될필요가없음 메시지전달이다소지연된다하더라도보내진메시지는반드시정상적으로수신측에도달하도록함 New 데이터통신과네트워킹응용계층과웹응용기법 4/52

12. 1 응용계층과이메일시스템 동시처리 (Spool) 기법 메시지전달에있어서지연을허용하기위해처리속도가서로다른장치간에데이터를처리하는기법 동시처리기법은고속장치로부터나오는출력데이터를저속장치의입력으로수용할수없는경우, 보조기억장치를사용하여그데이터를임시적으로보관 전송측시간지연 [ 그림 12-1] 사용자 A 는사용자에이전트 (UA) 를이용하여메일을작성하고메시지전달에이전트 (MTA) 를통해메일을전송 UA 와 MTA 사이에서동시처리기술을사용하여메시지의시간지연에대한처리수행 New 데이터통신과네트워킹응용계층과웹응용기법 5/52

12. 1 응용계층과이메일시스템 이메일시스템의구성 구성요소 사용자에이전트 (UA), 우편함과동시처리 (spool) 영역, 메시지전달에이전트 (MTA), 가명확장 (alias expansion), 데이터베이스등 [ 그림 12-2] 사용자 A 가사용자 B 에게로이메일을보내는경우 1 사용자 A는인터페이스를통해 UA에접근하고, UA를이용하여이메일을작성 2 가명확장기술과 MTA 클라이언트를이용하여작성된메일을전송 3 인터넷을경유하여사용자 A의메시지는사용자 B의 MTA 서버로전달 4 MTA 서버는가명확장기술과동시처리기술을연계하여우편함에메시지를전달 5 사용자 B는 UA를이용하여우편함에접근해서보관되어있는메시지를읽음 사용자 B 가사용자 A 에게로이메일을보내는경우 1 사용자 B가인터페이스를통해 UA에접근하여 UA를이용해이메일을작성 2 가명확장기술과 MTA 클라이언트를이용하여이메일을전송 3 사용자 B의메시지는인터넷을경유하여사용자 A의 MTA 서버로전달 4 MTA 서버는가명확장기술과동시처리기술을연계하여우편함에메시지를보냄 5 사용자 A는 UA를이용하여우편함에접근해서보관되어있는메시지를읽음 New 데이터통신과네트워킹응용계층과웹응용기법 6/52

12. 1 응용계층과이메일시스템 New 데이터통신과네트워킹응용계층과웹응용기법 7/52 이메일시스템의구성도

12. 1 응용계층과이메일시스템 사용자에이전트 (UA) UA 는사용자에게이메일메시지의전송과수신을보다원활하게해주는소프트웨어패키지 ( 프로그램 ) 메시지작성 (composing), 읽기 (reading), 응답 (replying), 전방위전송 (forwarding), 우편함처리 (handing mailboxes) 등의기능을수행함 [ 그림 12-3] 명령어기반 UA 의예 ) mail, pine, elm 등 New 데이터통신과네트워킹응용계층과웹응용기법 8/52

12. 1 응용계층과이메일시스템 SMTP 와메시지전달에이전트 (MTA) SMTP(Simple Mail Transfer Protocol) 메시지전달에이전트 (MTA) 클라이언트와 MTA 서버를정의하는프로토콜 MTA 메시지를전달하는소프트웨어에이전트 ( 프로그램 ) 이메일전송시스템의전송과정 [ 그림 12-4] SMTP 서버 ( 또는 MTA 서버 ) 와 SMTP 클라이언트 ( 또는 MTA 클라이언트 ) 사이의메시지전달과정 ➊ SMTP 는하나의 SMTP 클라이언트를구성하고, 목적지의장치이름과 IP 주소를일치시키고, 목적지장치와메일서버까지의 TCP 연결시도 ➋ 전송프로세스는메시지의복사본을원격지의 SMTP 서버까지전송하고, 이를원격시스템의동시처리영역에저장 ➌ 수신측 SMTP 서버가메시지수신 동시처리영역에저장하였다는것이확인되면전송측 SMTP 클라이언트는복사본삭제 New 데이터통신과네트워킹응용계층과웹응용기법 9/52

12. 1 응용계층과이메일시스템 우편함과가명확장 메일전송시사용되는이름은장치에할당되는이름과는독립적 우편함주소는사용자의로그인식별자 ( 사용자 ID) 와동일 목적지장치이름은일반적으로도메인이름과동일하게구성 가명확장과메일전방위전송 이메일시스템은가명확장 (alias expansion) 메커니즘을포함하는메일전방위전송응용프로그램을제공 하나의메일발신자는하나또는그이상의새로운메일주소를설정하기위해메일주소에사용되는식별자를일치시키는지역사이트정보를허용 이메일프로그램은메시지및수신자의이름을전송한다음, 메시지를전송하기전에매핑 (mapping) 된버전을갖는수신자로교체하기위해서 지역가명 을요청 매핑과정을거치지않은수신자는기존의상태를유지하며, 하부메일시스템은 가명 을사용하여들어오는수신자주소를일치시킴 가명시스템을사용함으로써한사용자가여러개의메일 ID를가질수있고, 하나의 ID 를갖는수신자의그룹할당이가능 New 데이터통신과네트워킹응용계층과웹응용기법 10/52

12. 1 응용계층과이메일시스템 우편함과가명확장지원요소 incoming 메일과 outgoing 메일은모두전방위전송 (mail forwarder) 과정을통해전송 사용자가사용자인터페이스를통해이메일을보내면 이는메일가명목록확장과전방위전송을통해나가는메일동시처리영역으로보내져서전송이이루어짐 상대방으로부터들어오는메일을서버가받으면 서버는수신된메시지를가명목록확장과전방위전송을통해서우편함으로보냄 사용자는사용자인터페이스를통해메시지를읽게됨 가명데이터베이스가메일주소 x 를 y 로교체하면 가명확장은목적지주소를 y 로교체 New 데이터통신과네트워킹응용계층과웹응용기법 11/52

12. 1 응용계층과이메일시스템 이메일주소 (electronic mail address) 이메일전송시스템에서사용하는주소로, 간단하고기억하기쉽도록구성 [ 그림 12-6] 도메인이름 : 메일이전송될메일목적지의도메인이름 지역영역 (local part) : 장치상의우편함의주소 인터넷과연결되지않은경우에는가장가까운메일게이트웨이의주소를갖거나, 혹은연 결되지않은경우에대한해결방안을지원하는소프트웨어를사용해야함 New 데이터통신과네트워킹응용계층과웹응용기법 12/52

12. 2 DHCP 기술 DHCP 란? 개발배경 인터넷사용의급증으로 IPv4 를기반으로하는인터넷구조로는호스트주소의부족등사용자의요구를충분히충족시키기가어려움 이에대한해결책으로 IPv6 로의대체가이루어지고있으나, IPv6 가완전하게 IPv4 를대체하여 상용화되기까지는다소시간이소요될전망 한정된 IP 주소를보다효율적으로사용하는방안으로동적 IP(dynamic IP) 기법인 DHCP 기술이개발됨 DHCP(Dynamic Host Configuration Protocol) - RFC 2131 정적혹은동적으로 IP 주소를할당하는기능을정의하는프로토콜 DHCP 는디스크가없는클라이언트의부팅을위해하드웨어주소를기반으로 IP 주소를할당하는 BOOTP(RFC 951) 의연장 DHCP 클라이언트는 DHCP 서버를찾기위해 발견방송패킷요청 (discovery broadcast packet request) 라는패킷을보냄 DHCP 클라이언트와서버프로세스는방송패킷을라우터로전송하는것이아니라, 지역간전송과정을통해처리 방송패킷에대한응답으로 DHCP 서버는 DHCP 클라이언트에게하나의 IP 주소를제공 New 데이터통신과네트워킹응용계층과웹응용기법 13/52

12. 2 DHCP 기술 New 데이터통신과네트워킹응용계층과웹응용기법 14/52 DHCP 구조및동작 DHCP 규격은 RFC 1533, 1534, 1541, 1542 등에규정 DHCP 서버와 DHCP 클라이언트간의동작 [ 그림 12-7] DHCP 클라이언트가 IP 대여를요구하면, DHCP 서버는 IP 대여서비스를제공한다는메시지를보냄 DHCP 클라이언트가 IP 대여서비스를선택하면서버는 IP 대여확인응답 동작종료 DHCP 의첫단계 ( 대여요청및제공 ) [ 그림 12-8] DHCP 클라이언트는부팅시, IP 주소를할당받기위해네트워크 IP 주소요청패킷인 DHCPDISCOVER 를보냄 DHCPDISCOVER 패킷의내용

12. 2 DHCP 기술 New 데이터통신과네트워킹응용계층과웹응용기법 15/52 DHCP 구조및동작

12. 2 IP DHCP 기술 New 데이터통신과네트워킹응용계층과웹응용기법 16/52 DHCP 기술 (1) 라우터가중간에있는경우라우터는 RFC 1542 를따라 DHCP 클라이언트가어떤서브네트워크에연결되어있는지를 DHCP 서버가판별할수있도록하고서브네트워크에적절한 IP 주소를할당함 다수의 DHCP 서버를가정 [ 그림 12-8] DHCP 서버들은클라이언트로부터이런요청을받으면클라이언트에게 DHCPOFFER 패킷을보냄 패킷의내용 만일모든 DHCP 서버에서응답이없다면, 9, 13, 16 초간격마다 0~1000msec 에해당하는임의시간을추가하여재시도 4 회의시도에도응답이없을경우에는포기하고, 이후 5 분마다다시 DHCP 서버에접속을시도 클라이언트로부터요청을받은모든 DHCP 서버는클라이언트에게응답을보내고, 클라이언트는그중에서한가지를선택

12. 2 IP DHCP 기술 New 데이터통신과네트워킹응용계층과웹응용기법 17/52 DHCP 기술 (2) 선택한 IP 주소가하나의서버에서대여하겠다고응답한것이므로다른서버에도이러한사실을알릴필요가있음 [ 그림 12-9] DHCPREQUEST 패킷의내용

12. 2 IP DHCP 기술 New 데이터통신과네트워킹응용계층과웹응용기법 18/52 DHCP 기술 (2)

12. 2 IP DHCP 기술 DHCP 기술 (3) DHCPREQUEST 패킷을 DHCP 서버가받으면 DHCPACK 을클라이언트에게전송 이러한패킷을보내는서버는클라이언트가선택한 IP 를대여하겠다고하는서버뿐임 나머지서버들은자신의대여가선택되지않음을알고다른클라이언트에게대여하기위해 IP 를보관 DHCPACK 패킷에는다음과같은내용이포함됨 New 데이터통신과네트워킹응용계층과웹응용기법 19/52

12. 2 IP DHCP 기술 IP 대여재경신 IP 주소의대여기간이종료되기전에 IP 주소를경신하여기간을연장하는메커니즘 대여기간이 1/2 이지난후 IP 주소를대여했던서버에 DHCPREQUEST 요청패킷전송 자신의 IP 주소를갖고있고, 어느서버가대여했는지를인지하고있어서, 정확한 IP 주소를패킷에기입할수있게됨 DHCP 서버는 IP 주소의대여기간을경신 변경된 DHCP 의추가옵션이있다면이옵션의내용을포함하여 DHCPACK 패킷전송 경신 작업 ipconfig/renew 라는명령을사용하여실행 New 데이터통신과네트워킹응용계층과웹응용기법 20/52

12. 3 웹과웹프로그래밍기법 웹과웹브라우저의기능 웹 (WWW) 과웹프로젝트 1989 년유럽핵물리공동연구소 (CERN) 의연구원이었던팀버너스리에의해서웹프로젝트시작 1990 년말에 NeXT 라는이름의컴퓨터에서동작하는최초의웹소프트웨어가발표 CERN 위원회에서개최한세미나와 1991 년도에개최된하이퍼텍스트학술대회에서이소프트웨어를이용한시연회 1992 년미국의슈퍼컴퓨팅센터 (NCSA) 에서 모자익 (Mosaic) 이라는이름의다중멀티플랫폼 (mutipltaform) 웹브라우저가무료배포 새로운인터넷시대 1994 년에팀버너스리는웹표준과정책지침 (guideline) 개발을목적으로하는미국비영리법인인 W3 컨소시엄 (W3C) 을창립하였고, 현재까지 W3C 를이끌며인터넷의발전에지대한공헌 정보의저장소 (repository) 라고할수있는웹은, 수많은서버로사용자가손쉽게접근하여다양한정보를얻을수있도록하게위해하이퍼텍스트구조형식을취함 웹브라우저 (web browser) 웹정보를검색하기위한프로그램 하이퍼텍스트의구조뿐만아니라각종언어의문서들을검색할수있음 브라우저의종류 : 마이크로소프트사의익스플로러, 구글사의크롬, 모질라사의파이어폭스, 애플사의사파리, 유럽의오페라등 New 데이터통신과네트워킹응용계층과웹응용기법 21/52

12. 3 웹과웹프로그래밍기법 웹브라우저의구조 웹브라우저의구조 [ 그림 12-11] 구성요소 : 제어기 (controller), 클라이언트프로토콜, 해석기 (interpreter) 로구분 제어기 : 입력장치부터입력을받아클라이언트프로그램을사용하여웹문서에접근 클라이언트프로토콜 : FTP, TELNET, HTTP 등이있음 해석기 : HTML, 자바 (java), 혹은자바스크립트등이사용됨 제작한홈페이지를다른사용자가검색하기위해서는웹서비스제공이가능한웹서버가필요 웹브라우저를이용해검색하고자하는웹사이트를지정하면 웹서버의정보가다시웹브라우저로전송 New 데이터통신과네트워킹응용계층과웹응용기법 22/52

12. 3 웹과웹프로그래밍기법 URL 이란? URL(Uniform Resource Locator) [ 그림 12-12] 웹문서가있는위치, 사용하는프로토콜, 특정웹페이지를지정하는파일명등에대한구체적인정보를나타내는표준 프로토콜 : 웹문서를검색하는 FTP, HTTP, News, TELNET 과같은클라이언트서버프로그램 호스트 : 정보가위치하고있는호스트컴퓨터 New 데이터통신과네트워킹응용계층과웹응용기법 23/52

12. 3 웹과웹프로그래밍기법 하이퍼텍스트전달프로토콜 (HTTP) 하이퍼텍스트 : 인터넷사용자 ( 클라이언트 ) 가필요한정보의자유로운검색을가능하도록해주는텍스트의전개방식 HTTP : 하이퍼텍스트방식의정보를교환하기위한하나의규칙 웹서버와클라이언트가상호데이터통신을하기위해사용하는하이퍼텍스트전송규약 HTTP 처리과정 : 요구 (request) 메시지와 응답 (response) 메시지로이루어짐 웹클라이언트가요구메시지를보내면 HTTP 처리과정이개시되고, 이에대한응답으로서버가응답메시지를보냄 New 데이터통신과네트워킹응용계층과웹응용기법 24/52

12. 3 웹과웹프로그래밍기법 요청메시지와응답메시지의구성형식 요청메시지의요청라인 (request line) : 요청유형영역, URL 영역, HTTP 버전영역으로구분 응답메시지의상태라인 (status line) : HTTP 버전영역, 상태코드, 상태서술문구 (phrase) 로구분 요청유형 : 사용하는메소드 (method) 가무엇인가에따라구분 GET : 서버로부터웹문서를요청할때사용 HEAD : 문서자체가아니라문서와관련된정보를요청할때사용 POST : 클라이언트에서웹서버로정보를전송하고자할때사용 PUT : 서버가클라이언트로문서를보낼때사용하는메소드 New 데이터통신과네트워킹응용계층과웹응용기법 25/52

12. 3 웹과웹프로그래밍기법 하이퍼텍스트 (hypertex) 문서를보다쉽게검색이가능하도록문서의일부를다른문서와연결 (hyperlink) 시킨텍스트 사용자가하이퍼링크로작성된임의의그림이나글자를클릭하면곧바로그글자나그림이연결된부분으로연계되도록함 일반적으로홈페이지는하이퍼링크로연결된문서들의집합으로작성됨 New 데이터통신과네트워킹응용계층과웹응용기법 26/52

12. 3 웹과웹프로그래밍기법 HTML(HyperText Markup Language) 웹문서를작성하는데사용되는일종의프로그램언어 HTML 문서는다른언어와달리마크업 (mark up) 언어로구성되어있어, 운영체제의종류와상관없이웹브라우저만으로도프로그램을실행할수있음 마크업 이란? 문서작성시태그 (tag) 를중심으로하여명령을내리거나지시를하는것 마크업의기본적인태그명령어 New 데이터통신과네트워킹응용계층과웹응용기법 27/52

12. 3 웹과웹프로그래밍기법 HTML 을이용한웹페이지작성과동작 HTML 을이용하여웹페이지를작성하려면 HTML 문서를제작할수있는편집기와 HTML 문서를볼수있는웹브라우저만있으면됨 HTML을이용하여작성된간단한프로그램 <html> : HTML 문서의시작을나타내는태그 </html> : HTML 문서의종료를나타내는태그 <html> 과 </html> 사이에있는 <head> 와 </head> : 머리글의시작과끝을나타냄 홈페이지생성 라는이름의폴더를만들고 그안에 홈페이지.html( 또는홈페이지.htm) 이라는이름의파일을생성 사용자웹브라우저에서 홈페이지.html 이란 이름의파일을읽으면웹페이지가만들어짐 [ 그림 12-15] New 데이터통신과네트워킹응용계층과웹응용기법 28/52

12. 3 웹과웹프로그래밍기법 웹프로그램의동작 사용자 ( 클라이언트 ) 가 HTTP 를이용하여웹서버로요구메시지를보내면, 서버는 HTTP 를이용하여 홈페이지.html 을포함하는응답메시지를전송 사용자 ( 클라이언트 ) 의브라우저는 HTML 해석기를동작시켜 홈페이지.html 의내용을화면상에나타냄 New 데이터통신과네트워킹응용계층과웹응용기법 29/52

12. 3 웹과웹프로그래밍기법 홈페이지배경설정 </head> 다음에 <body> -- </body> 를추가함 Bgcolor : 배경색 FFFCC : 색상기호 배경색을나타내는부분인 <body bgcolor= #FFFFCC > 구문에따라 [ 그림 12-17] 과같은배경색이나타남 New 데이터통신과네트워킹응용계층과웹응용기법 30/52

12. 3 웹과웹프로그래밍기법 배경화면설정과본문삽입 배경화면설정 홈페이지.html 파일이저장되어있는홈페이지폴더안에 pic 라는폴더를새로생성 pic 폴더에 back.jpg 라는파일을저장한후, <body background=#ffffcc > 에서 #FFFFCC 부분을원하는 배경그림파일명 으로변경 배경그림을지정하기위해서는 <body background= pic/back.jpg > 와같은내용을추가 본문삽입 본문은 <body> 와 </body> 사이에기록 <br> : 줄을변경하라 는의미의태그 가운데로글자를정렬하려면 <center> 와 </center> 사이에글자를기록 만일 back.jpg 라는이름의그림파일이없다면배경은흰색으로처리 New 데이터통신과네트워킹응용계층과웹응용기법 31/52

12. 3 웹과웹프로그래밍기법 HTML 을이용한웹페이지작성과동작 본문삽입 이와같이작성된최종 홈페이지.html 파일을실행하면 [ 그림 12-18] 에서와같은결과가나옴 글자크기바꾸기 <font size=2> 와 </font> 사이의글자크기가변함 글자크기 (font size) 는 1~7 까지선택가능함 New 데이터통신과네트워킹응용계층과웹응용기법 32/52

12. 3 웹과웹프로그래밍기법 글꼴바꾸기와다른문서와의연결 글꼴바꾸기 <font face=arial> 폰트 </font>, <b> 진하게 </b>, <i> 이탤릭 </i>, <u> 밑줄 </u>, <tt> 타자체 </tt> 등이있음 작성된 홈페이지글꼴.html 파일을실행하면 [ 그림 12-19] 와같은결과가나옴 다른문서와의연결 하이퍼텍스트로작성된웹문서들사이에서상호간연결 (link) 을통해보고자할때에는연결태그인 <A> 를사용 <A> : 연결속성에는 name 과 href 가있음 Name : 현재문서내에서의연결을위한것으로 <A name= 연결할경로명 > 과같은형식을가짐 href(hyperlink Reference) : 다른문서와의연결을위한것으로 <A href= 연결할경로명 > 과같은 형식으로사용 New 데이터통신과네트워킹응용계층과웹응용기법 33/52

12. 3 웹과웹프로그래밍기법 New 데이터통신과네트워킹응용계층과웹응용기법 34/52 HTML 을이용한웹페이지작성과동작 예제

12. 4 자바와웹응용기법 CGI 프로그램과자바 CGI(Common Gateway Interface) 프로그램 웹페이지를동적으로작성하고자하는경우에활용할수있는매우유용한기술 CGI 기술을이용하여사용자의요구에따라다양한정보를처리하는발전된기법이개발 CGI를통해서전달된사용자의요청사항들을식별하며, 그요청사항에대한응답을생성 자동으로 HTML문서의내용을변경할수있도록하기위해서웹브라우저와웹서버간의정보전달을위한인터페이스를제공 CGI 인터페이스를이용하면사용자가원하는웹페이지의내용을변경하여보여줄수있음 자바 (java) 프로그래밍기법 적극적으로웹을사용하여사용자상호간의대화형서비스를가능하게해주는기술 1991 년선마이크로시스템 (Sun Microsystems) 에서개발시작 제임스고슬링 : 당시단순하고버그가없는가전전자제품을만드는것을목적으로소프트웨어개발에착수 초기에는 C++ 의컴파일러를확장하는방법을사용하려했으나, C++ 가특정 CPU 에따라컴파일작업이실행되어야하는속성때문에서로다른장치들을연결해야하는환경에서는적합하지못함 다양한가전제품에독립적으로적용될수있는새로운프로그래밍언어가개발필요 결과로오크 (Oak) 라는프로그래밍언어가탄생 이후오크 (Oak) 는자바 (java) 로이름변경 New 데이터통신과네트워킹응용계층과웹응용기법 35/52

12. 4 자바와웹응용기법 애플리케이션과자바애플릿 자바프로그램 C 나 C++ 프로그램처럼에디터를이용하여소스파일을작성하고, 자바컴파일러를이용하여실행파일을생성 자바실행파일 바이트코드 (bytecode) 라는형식을사용 이유? 하드웨어나운영체제와관계없이프로그램이실행되도록하기위해 자바로작성된응용프로그램은다양한하드웨어와운영체제에서변경없이실행가능 자바 애플릿 웹브라우저를통해서곧바로실행가능한프로그램 자바 응용프로그램 웹브라우저가없어도독립적으로실행가능한프로그램 자바소스파일의생성과컴파일, 실행과정 [ 그림 12-20] Name.java 라는자바소스파일작성 Name.java 파일을컴파일하면 Name.class 파일생성 이렇게생성된 Name.class 파일을 HTML 파일로변경하고웹브라우저를이용해실행시켜결과확인 New 데이터통신과네트워킹응용계층과웹응용기법 36/52

12. 4 자바와웹응용기법 자바프로그램의특징 ➊ 자바프로그램은비교적단순한구조를취하므로손쉽게프로그램을작성할수있음 자바는널리사용되는객체지향언어인 C++ 와매우유사한구조를가짐 ➋ 자바는모든것이객체로취급되는객체지향언어이지만, C++ 에서와같이전역변수와독립함수를사용하지않고객체들간의상호작용방식이적용됨 하나의객체는객체의상태를나타내는데이터변수와객체의동작을정의하기위한함수로구성 데이터와함수를객체라는단위로묶음으로써코드관리및유지가용이 중요한데이터를객체내에서처리되도록하여필요한경우에만데이터에접근이가능 ➌ 자바는특정플랫폼 (platform) 이아닌다양한네트워크환경과하드웨어에서동작이가능하도록설계됨 다양한운영체제와언어환경에서도실행이가능 자바컴파일러는 바이트코드 라는중립적인코드를사용하여플랫폼에대한독립성을유지 ➍ 높은신뢰성과안정성을고려하여설계됨 컴파일을수행할때에엄격한데이터형을검사함으로써프로그램실행시발생할수있는비정상적인동작최소화 ➎ 자바는멀티스레드 (multi-thread) 기능을제공함 멀티스레드 : 하나의프로그램안에서여러작업을동시에처리할수있는기능 ( 예 ) 웹브라우저를통해파일을다운받으면서동시에다른사이트를검색이가능하도록하는기능 New 데이터통신과네트워킹응용계층과웹응용기법 37/52

12. 4 자바와웹응용기법 클래스의형식 클래스정의 class 라는키워드와클래스이름, 기호 { } 를이용함 클래스형식 < > 안의내용은옵션에해당하여필요한경우에만사용 extends : 클래스를상속 implements : 인터페이스를사용 Modifiers : 정의하고자하는클래스의성질을지정해주는부분 public, final, abstract 중에서하나의값을사용함 이값에의해클래스의접근여부나상속여부등이결정됨 class 앞이공백상태이면디폴트 default 가되어 public 이선언된것으로취급 public : 다른클래스에서접근을허용한다는의미이며, 더이상서브클래스를사용하지않는경우에는 final 로선언 abstract : abstract 로선언된메소드를가질수있음 abstract 메소드는선언만있고실제내용이없는추상적인메소드로, 단지슈퍼클래스로서전체적인프레임만지정하기위해서사용되는것임 New 데이터통신과네트워킹응용계층과웹응용기법 38/52

12. 4 자바와웹응용기법 클래스의정의와변수 클래스정의 클래스의성질과이름과슈퍼클래스를지정한다음에는실제클래스의내부환경을정의해야함 클래스내부에는클래스변수와메소드만이들어갈수있음 클래스변수는클래스의여러가지상태에관한정보의기억장소에해당함 메소드는변수에접근하는방법이나클래스의동작방법을정의함 클래스변수정의 클래스에서는정수형, 실수형등대부분의자료형 ( 데이터형태 ) 을변수로사용할수있음 클래스변수에대한접근을제한하기위해서는 public, private, protected 와같은키워드를사용함 public 으로선언된변수 : 언제어디서나접근할수있는속성을가짐 private 로선언된변수 : 클래스내부에서만접근할수있고외부에서는접근할수가없음 protected 로선언된변수 : private 처럼클래스내부에서만접근할수있고이클래스에서상속된서브클래스에서도상속이가능하지만, 외부에서접근하는것은금지 만일 public, private, protected 중어느것도사용되지않고그대로변수가선언된다면 public 처럼외부에서접근할수있게됨 변수에대한접근을제한하는것은객체지향프로그래밍의특징중에하나인정보은닉 (hiding) 기법을구현하기위함 객체안에변수를은닉함으로써변수값이임의로변경되는것을방지할수있음 New 데이터통신과네트워킹응용계층과웹응용기법 39/52

12. 4 자바와웹응용기법 메소드 메소드에대한정의또한클래스에서사용했던접근제한키워드를그대로사용하면됨 메소드는함수에해당하기때문에함수가갖는속성들을그대로가짐 함수는반환값 (return) 을먼저지정하고함수이름을쓴후에매개변수들을나열하는방식을취함 testprint 메소드는 public 으로선언하여접근이가능하도록열어놓고있음 반환값은 void 로선언함으로써아무것도반환하지않는다는것을알려줌 매개변수로 x 와 y 라는 int 형자료를선언하는데, 이메소드는매개변수에 int 형값을넣은상태에서사용해야함을의미 클래스변수와메소드의성질선언 클래스변수와메소드의속성을선언할수있는또다른종류의키워드가있음 클래스변수와메소드의수명과존재유형을지정하기위한키워드 : static, final, transient, volatile static 는변수가클래스에만존재할수있도록하며, 클래스에서선언된여러개의객체들이동시에공유할수있는유일한클래스변수와메소드가됨 클래스는오직하나만존재하지만객체는원하는숫자만큼생성할수있으므로 static 이지정되지않은변수들은객체가하나선언될때마다하나씩생성됨 New 데이터통신과네트워킹응용계층과웹응용기법 40/52

12. 4 자바와웹응용기법 메모리할당과클래스생성자 new 연산자를이용한객체의메모리할당 객체의선언만으로는메모리가할당되지않으며, 메모리가할당되지않으면변수값을기억할수있는주소가생성되지않아메소드를사용할수없게됨 이런이유로메모리를할당하는루틴 (routine) 이필요하게되고, 객체의메모리할당을하려면 new 연산자를사용하면됨 매개변수가있는생성자를호출하는경우라면아래와같이메모리할당루틴을활용함 클래스생성자 클래스의초기화를위해제공하는메소드 반환값을지정하지않아도되지만이름은클래스와동일해야함 클래스의이름을갖는메소드가있다면, 모두생성자에속한다고볼수있음 이생성자는다른메소드처럼호출할수는없으며, 객체를선언하고메모리를할당할때자동으로호출됨 New 데이터통신과네트워킹응용계층과웹응용기법 41/52

12. 4 자바와웹응용기법 New 데이터통신과네트워킹응용계층과웹응용기법 42/52 자바를이용한웹페이지작성법 - 소스코드 import java.applet.* 과 import java.awt.graphics 는자바프로그램을시작하기전에 applet 이라는자바패키지와 Graphics 라는패키지를본프로그램에첨부하겠다는의미 public class hello_java extends Applet 은 Hello_java 를 Applet 에서확장하겠다는의미이므로, 이프로그램이자바애플릿프로그램임을알려줌 클래스의이름이 hello_java 임을알수있음 public void paint(graphics g) 는 paint( ) 라는함수가 Graphics g 라는인자를받아서화면상에출력하도록하는, 즉애플릿을실행해주는함수의일부분임 something s=new something(105); 는변수를 s something 의객체유형으로선언하는부분임 C++ 와는달리선언만으로는객체를생성하지못하기때문에, new 라는연산자를통해서객체를생성해야함

12. 4 자바와웹응용기법 자바를이용한웹페이지작성 클래스의멤버를선언하는부분 이미 hello_java 라고선언된모 (parent) 클래스로부터하위 (child) 클래스를선언하고있음 something 이라는하위클래스와메소드및변수를선언함 value 는멤버변수를의미하고, something(int value) 는멤버함수로서선언된 value 를값으로 받아수행하는코드 this.value=value; 의코드는이미생성자를통해 value 멤버에특정값 ( 예를들어 105 란값 ) 을할당 매개변수이름과클래스이름이이처럼중복되면, 이를구별하기위해서는매개변수이름을변경하는방법을선택하거나 this 라는키워드를사용하여구분 위의코드에서함수는먼저 string 변수 s 를선언함 괄호왼쪽에문자열객체 s 를지정하고, 괄호오른쪽의값을지정 반환문을사용해서 tostring 은문자열을호출함수에반환 / Something 클래스멤버변수 value 는 int 형임 자바는 int,float 등과같이기본형에대하여 tostring 함수에해당하는내장된함수를제공 tostring 함수의경우, string 식에서변수 value 를사용할때내장된함수를사용해서변수값을 int 에서 string 으로변환함 New 데이터통신과네트워킹응용계층과웹응용기법 43/52

12. 5 HTML5 기술 HTML5 란무엇인가 등장배경 마크업정보란 > 문서의논리구조나서식지정, 단어나구와같은요소를동일문서혹은타문서에있는다른문서요소들과연결하는방법을지정하여컴퓨터에지시하는정보를말함 HTML 은 1993 년웹표준의초안이발표된이후 HTML 2.0, 3.2, 4.0 버전이발표 1999 년 HTML 4.01 버전이출시되고, 이후웹표준은 XML 과 XHTML 로초점이옮겨갔음에도불구하고여전히웹콘텐츠는 HTML 로제공 이에따라새로운차원의웹플랫폼에대한필요성이대두되었으며, 그에따라 2004 년에 WHATWG 가결성되고, 2008 년에는 HTML5 표준의초안이발표됨 HTML5 란? 웹하이퍼텍스트응용기술워킹그룹 (WHATWG) 과 W3C HTML 워킹그룹에서개발이진행중인웹표준명세서로, 웹응용 (application) 을위한 HTML4, XHTML1 의새로운버전 ( 구조 ) HTML5 네트워크, 저장장치, 사용자, 다양한응용들과상호연동되고, 모든기기와 플랫폼에서 HTML5 기능이동작하는개방형웹플랫폼 (open web platform) 구조 [ 그림 12-21] New 데이터통신과네트워킹응용계층과웹응용기법 44/52

12. 5 HTML5 기술 HTML5 의특성 호환성 (compatibility) HTML5 는기존의 HTML 문서를지원하는진화된버전 HTML5 의특성이지원되지않을경우단계적으로기능을축소시킨다는점에유의 유용성 (utility) HTML5는개발자보다도사용자를최우선으로함 XML로유효한 HTML5 코드를생성하기위해 XHTML5도만들어냄 HTML5는완벽보다는실용성이강조됨 상호운용성 (interoperability) HTML5는불필요한복잡성을최대한제거, 단순성을최우선으로하여상호운용성보장 단순함을유지하면서명확한표준이되려면상호운용성을보장하는많은규칙이필요 HTML5 표준명세서의분량은더욱늘어나게됨 보편적접근성 (universal access) HTML5 는장애가있는사용자를지원하며, 가능한한모든기기와플랫폼에서동작하도록하는미디어의독립성과전세계언어지원이라는개념으로접근하고있음 New 데이터통신과네트워킹응용계층과웹응용기법 45/52

12. 5 HTML5 기술 HTML5 의주요기술 (1) HTML5 를기반으로구현된앱은대부분모바일플랫폼에적용가능하며, 이미지나애니메이션, 동영상등도별도의플러그인설치가없어도구현가능 HTML5 만으로완전한인터랙티브웹을생성하지는못함 먼저 HTML5 로프레임 (frame) 을만든다음, CSS 로글꼴이나크기, 색상등의시각적요소들을추가하고, 자바스크립트로인터랙션 ( 이벤트 ) 이발생하도록하고있기때문 보다다양한이벤트를제공하고완전한인터랙티브웹을생성하기위해서는? jquery, YUI 등의자바스크립터나 Skeleton 과같은 CSS 프레임워크와 jquery Mobile, Sencha 등과같은모바일웹프레임워크의개발이요구됨 새로운차원의웹플랫폼으로서 HTML5 기술은다양한기술적요소를포함하며, 문서의구조와데이터의의미를보다명확히하기위한시멘틱요소추가 다검색엔진및문서해석기등에서웹문서판별이정확하고용이함 시멘틱요소의예 ) <section>, <article>, <aside>, <header>, <footer>, <address> 등 New 데이터통신과네트워킹응용계층과웹응용기법 46/52

12. 5 HTML5 기술 HTML5 의주요기술 (2) 캔버스 API 캔버스 (Canvas) : 애플맥에서대시보드위젯생성시도입된개념 이전에는어도비의드로잉 API 나 SVG(Scalable Vector Graphics), 자바스크립트등을사용하였음 캔버스 API 를사용하면그래픽, 차트, 그림, 애니메이션을동적으로생성하고처리가능 캔버스요소를웹페이지에추가하면페이지내에사각영역이생성되고, 페이지에삽입된캔버스요소는자바스크립트를이용하여그래픽, 선, 텍스트추가, 그림, 애니메이션등원하는대로조작이가능함 캔버스요소를웹페이지에추가하는예로다음코드가실행되면사각영역이생성됨 캔버스를사용하려면먼저컨텍스트데이터를얻은다음, 이를통해동작을실행시킴 캔버스 3D(WebGL) 를활용하면 3D 그래픽표현에대한지원도가능함 New 데이터통신과네트워킹응용계층과웹응용기법 47/52

12. 5 HTML5 기술 HTML5 의주요기술 (3) 멀티미디어캔버스 웹상에서비디오, 오디오를표현하기위한태그및 API 를지원 비디오컨테이너파일 오디오트랙, 비디오트랙, 추가적인메타데이터로구성 비디오컨테이너형식 : aviaudio video interleave, flvflash video, mp4mpeg4, mkvmatroska, ogvogg 등 비디오, 오디오요소에대한접근성에관한기술은아직미진함 웹스토리지와웹워커 웹스토리지 (web storage) 웹사이트의정보를사용자의 PC에저장할수있는메커니즘을제공 기존쿠키의용량제한및트래픽부담의단점을해소 웹워커 (web worker) 비동기백그라운드처리수행이가능한 API 를제공 멀티쓰레드웹응용프로그램개발이가능해짐 New 데이터통신과네트워킹응용계층과웹응용기법 48/52

12. 5 HTML5 기술 HTML5 의주요기술 (4) 응용캐쉬와서버푸시 응용캐쉬 인터넷이연결되지않은상태에서오프라인응용프로그램구현이가능하도록지원 서버푸시 (server push) 서버로부터의데이터를푸시받을수있는서버전송이벤트 (server-sent event) 제공 위치정보서비스와드래그앤드롭 위치정보서비스 지리정보및위치정보를이용할수있는 API 를제공 ( 장치종속적임 ) 드래그앤드롭 (drag & drop) 웹페이지내혹은외부개체를웹페이지로드래그, 드롭이가능한 API 를제공 New 데이터통신과네트워킹응용계층과웹응용기법 49/52

12. 5 HTML5 기술 New 데이터통신과네트워킹응용계층과웹응용기법 50/52 HTML5 의주요기술 예제

12. 5 HTML5 기술 새로운 API HTML5 는자바스크립트와함께사용할수있는다양한 API 를지정하며, 기존의문서객체모델 (DOM) 인터페이스확장 응용계층과웹응용기법 [ 그림 12-22] 가장안쪽원내부에있는기술들은초기 WHATWG HTML5 명세들 두번째원내부에는 W3C HTML5 관련기술의명세 세번째원내부에는 HTML5 관련기술들을구분 New 데이터통신과네트워킹응용계층과웹응용기법 51/52

Q & A New 데이터통신과네트워킹응용계층과웹응용기법 52/52