부록 . 웹 서버 구축하기
HTML5
웹 프로그래밍 입문(
개정판)
1
목차
A.1 웹 서버 시스템 A.2 PHP 사용하기
A.3 데이터베이스 연결하기
A.1 웹 서버 시스템
3
웹 서버의 구축
■ 웹 서버 컴퓨터 구축
웹 서버 소프트웨어 설치 및 실행
아파치 (Apache) 웹 서버가 대표적■ 서버 실행 프로그램
HTML5 폼을 전달받아 처리
PHP, JSP, Python 등■ 데이터베이스 시스템
서버 측에 데이터를 저장 및 효율적 관리
MySQL, SQL, Oracle 등웹 서버 - 클라이언트 연결 구조
5
Web Servers Web Clients
TCP/IP HTTP
TCP/IP HTTP
Database 웹 서버 프로그램
웹 문서 HTML5, CSS JavaScript, XML PHP, Python
JSP
Web Browser HTML5, CSS,
JavaScript
URL (주소), 폼 입력 데이터
웹 문서 웹 문서,
서버 프로그램 파일 전송 (ftp 등)
PHP 작동 순서
Web Servers Web Clients
(Web Browser)
웹 서버 프로그램 (웹 페이지웹 문서 ) HTML5, CSS JavaScript
PHP, Python JSP, Javascript 파일 전송
프로그램 (ftp 등) HTML5/CSS
PHP
Web Clients (Web Browser)
URL (html) 웹페이지 방문
HTML5/CSS 결과 페이지 HTML5/CSS
결과 페이지 2 HTML5/CSS
결과 페이지 1 HTML5/CSS
URL (php) 결과 페이지 HTML5/CSS upload
A.2 PHP 사용하기
7
웹 서버 프로그래밍 언어 , PHP
■ PHP(PHP: Hypertext Preprocessor)
웹 서버 용 스크립트 언어
HTML 문서에서 <?php 와 ?> 안에 스크립트를 넣어 사용 => PHP 스크립트가 서버에서 처리
=> 결과인 HTML 문서만 브라우저에 보여줌
<!DOCTYPE HTML>
<html>
<body>
<?php
print "<p> Hello PHP! </p>";
?>
</body>
</html>
<!DOCTYPE HTML>
<html>
<body>
<p> Hello PHP! </p>";
</body>
</html>
서버
(php)
실행 결과
(html)
■ PHP 특징
윈도우 , 유닉스 , 리눅스 OS 에 아파치 웹 서버를 설치하여 사용 LAMP(Linux Apache MySQL PHP), WAMP(Windows Apache MyS QL PHP)
다양한 데이터베이스에 대해 사용하기 간편한 인터페이스 제공9
<!DOCTYPE HTML>
<html>
<body>
<h2> PHP 예제 </h2>
<?php
print "<p> Hello PHP!
</p>";
print "<p> Welcome to HTML5
Web Programming 입문
</p>";
?>
</body>
</html>
<body>
<h2> PHP 예제
</h2>
<p> Hello PHP!
</p>
<p> Welcome to HTML5 Web
Programming 입문 </p>
</body>
PHP 시작하기 : 함수 , 변수
■ 함수
■ 변수 : $ 변수명
<html>
<body>
<p>PHP 요일 확인 예제</p>
<?php
$week_day = date("D");
print "<strong> Today is $week_day.. </strong><br/>";
if ($week_day == "Fri")
print "[$week_day] Have a nice weekend!";
elseif ($week_day == "Sun")
print "[$week_day] Have a nice Sunday!";
else
print "[$week_day] Have a nice day!";
?>
</body>
</html>
<body>
<p>PHP 요일 확인 예제</p>
<strong> Today is $week_day..
</strong><br/>
[Wed] Have a nice day!
$week_day =
“Wed”
간략한 PHP 문법
11
■ 주석 : // 혹은 /* … */
■ 출력 : print 혹은 echo
■ 변수
$ 를 붙여 변수로 사용 .
$variable_name■ 데이터 타입
Boolean, Integer, Floating point, 문자열 ("abcdef” 혹은 'abcdef‘)
문자열 붙이기 : . 연산자 ( 점 연산자 ), "abc"."def" "abcdef"
■ 제어문 ( 선택문 , 반복문 )
if, switch, whie, for 문 제공 됨
C, Java 문법과 유사
간략한 PHP 문법
■ 함수 정의
function 함수이름 ( 매개변수 ) {
…
함수 정의 ;return ( 반환값 );
}
■ 폼 입력 값
$_GET, $_POST 배열로 전달 받음■ 배열
$arr = array();
$arr[] = "apple"; $arr[] = "grape"; $arr[] = "melon";
$arr = array("apple", "grape", "melon");PHP 로 폼 다루기
13 Web Servers
웹 서버 프로그램 (웹 페이지웹 문서 ) HTML5, CSS JavaScript
**.PHP
Web Clients
URL (html)
웹페이지 (HTML5/CSS)
…
…<form action=“…/…/**.php” method=“…” >
<input …>
<input …>
…
<input type=“button” …>
</form>
…
결과 페이지 HTML5/CSS 결과 페이지
HTML5/CSS URL (../../**.php)
폼 입력 데이터 (GET방식 혹은 POST 방식)
PHP 로 폼 다루기 (1)
■ <form> 에서 action, method 속성
예 , <form action="formexample.php" method="GET">
변수명은 name 속성값 GET 메소드의 경우 : $_GET[" 변수명 "]
POST 메소드의 경우 : $_POST[" 변수명 "]
<body>
<p> form 으로 PHP 프로그램 실행</p>
<form action="formexample1.php" method="GET" >
유형 선택 :
<input type="radio" name="kind" value="news">구글 뉴스 <input type="radio" name="kind" value="blog">네이버 블로그
<input type="radio" name="kind" value="search"> 네이버 검색<br/>
키워드 입력 :
<input type="text" name="keyword" size="15">=>
<input type="submit" value="PHP 실행">
</form>
</body>
http://webclass.me/html5_2e/appendix/formexa mple.php?kind=search&keyword=%EB
%B0%95%EC%A7%80%EC...
kind=sear ch keyword=“박지
성”
formexample1.html
15
<?php
$k = $_GET["kind"];
$w = $_GET["keyword"];
?>
<p> form 으로 데이터 전송 결과</p>
<p> 기사 유형(kind): <?php print $k; ?> </p>
<p> 키워드 (keyword)는 [ <?php print $w; ?> ] 입니다.</p>
<?php
if ($k=="news")
$result_url = "'http://www.google.co.kr/search?tbm=nws&q=$w'";
elseif ($k=="blog")
$result_url = "'http://section.blog.naver.com/sub/SearchBlog.nhn?
option.keyword=$w'";
elseif ($k=="search")
$result_url = "'http://search.naver.com/search.naver?query=$w'";
?>
<script type="text/javascript">
window.open(<?php print $result_url;?>);
</script>
formexample1.php
다음 슬라이드
<?php
$k = $_GET["kind"];
$w = $_GET["keyword"];
?>
<p> form 으로 데이터 전송 결과</p>
<p> 기사 유형(kind): <?php print $k; ?> </p>
<p> 키워드 (keyword)는 [ <?php print $w; ?> ] 입니다.</p>
<?php
if ($k=="news")
$result_url = "'http://www.google.co.kr/search?tbm=nws&q=$w'";
elseif ($k=="blog")
$result_url = "'http://section.blog.naver.com/sub/SearchBlog.nhn?
option.keyword=$w'";
elseif ($k=="search")
$result_url = "'http://search.naver.com/search.naver?query=$w'";
?>
<script type="text/javascript">
window.open(<?php print $result_url; ?>);
</script>
window.open('http://search.naver.com/search.naver?
query=$w'");
formexample1.php (
계속)
PHP 로 폼 다루기 (2)
17
<h3>도서 대출 신청 양식</h3>
<form action="formexample2.php" method="GET">
대출 도서관 선택:
<label> <input type="checkbox" name="seoul">서울도서관</label>
<label> <input type="checkbox" name="cheonan">천안도서관 </label>
<label> <input type="checkbox" name="jeju">제주도서관</label>
<br><br>
대출 기간 선택:
<select name="duration">
<option value="1week"> 1주 </option>
<option value="2week"> 2주 </option>
<option value="4week"> 4주 </option>
<option value="8week"> 8주 </option>
</select> <br><br>
대출 시작 날짜:
<input type="date" name="date"/> <br><br>
대출 시작 시간:
<input type="time" name="time"/> <br><br>
포장 색상 선택:
<input type="color" name="color"/> <br><br>
<input type="submit" value="신청하기">
<input type="reset" value="리셋">
</form>
http://webclass.me/.../appendix/formexamp le2.php?
seoul=on&cheonan=on&duration=4week&
date=2017-04-19&time=14%3A00&color=
%23ff8080
seoul=on&cheonan
=on
duration=4wee k
date=2017-04- 19
…
formexample2.html
<h3>도서 대출 신청 결과</h3>
<?php
$period = $_GET["duration"];
$d = $_GET["date"];
$t = $_GET["time"];
$c = $_GET["color"];
?>
대출 요청 도서관:
<?php
if ($_GET["seoul"]=="on") print "서울도서관 ";
if ($_GET["cheonan"]=="on") print "천안도서관 ";
if ($_GET["jeju"]=="on") print "제주도서관 ";
?>
<br>
대출 요청 기간 : <?php print $period;?> <br>
대출 시작 날짜 : <?php print $d;?> <br>
대출 시작 시간 : <?php print $t;?> <br>
포장 색상 요청 : <?php print $c;?>
<h3>도서 대출 신청 결과</h3>
대출 요청 도서관: 서울도서관 천안도서관
<br>
대출 요청 기간: 4week <br>
대출 시작 날짜: 2017-04-19 <br>
대출 시작 시간: 14:00 <br>
포장 색상 요청: #ff8080
seoul=on&cheonan=
on&
duration=4week&
date=2017-04-19&
time=14%3A00&
color=%23ff8080
formexample2.php
보충 - 폼 (3)
19
<form action="formexample3.php" method="GET">
대출 도서관 선택:
<label> <input type="checkbox" name="place[]" value="seoul">서울도서관
</label>
<label> <input type="checkbox" name="place[]" value="cheonan">천안도 서관</label>
<label> <input type="checkbox" name="place[]" value="jeju">제주도서관
</label> <br><br>
대출 기간 선택:
<select name="duration[]" multiple>
<option value="1week"> 1주 </option>
<option value="2week"> 2주 </option>
<option value="4week"> 4주 </option>
<option value="8week"> 8주 </option>
</select> <br><br>
<input type="submit" value="신청하기">
<input type="reset" value="리셋">
</form>
<h3>도서 대출 신청 결과</h3>
<?php
$city = $_GET["place"];
$period = $_GET["duration"];
?>
대출 요청 도서관:
<?php
for ($i=0; $i<count($city); $i++) print
$city[$i]." ";
?>
<br>
대출 요청 기간:
<?php
for ($i=0; $i<count($period); $i++) print
$period[$i]." ";
?>
formexample3.html
formexample3.php
A.3 데이터베이스 연결하기
SQL 문
■ 데이터베이스를 다루기 위한 언어
데이터베이스 생성 , 테이블 생성 , 테이블에 레코드 읽기 , 저장 , 변경 등을 수행■ query ( 질의 )
SQL 문으로 기술된 데이터베이스에 대한 요청 예 , 이미 생성된 데이터베이스 테이블에 레코드 삽입 및 접근
테이블에 레코드 삽입 : insert insert into 테이블이름 ( 필드이름 1, 필드이름 2, . . .) values ( 필드 값 1, 필드값 2 . . . )
테이블에서 레코드 선택 : select select 필드이름 1, 필드이름 2, . . .
select * from 테이블이름 where 조건
21
PHP 에서 MySQL 실행하기
1. MySQL 데이터베이스 연결
$db = new mysqli( 서버이름 , 사용자계정이름 , 비밀번호 , DB 이 름 );2. 질의 (query) 요청
$result = $db->query( SQL 질의 );■ 예 , 선호도 조사
<p> 음식 선호도 조사</div>
<form method="get" action="favorate_food.php">
<p> 이름을 입력해 주세요.</p>
<input type="text" name="name">
<p> 좋아하는 음식을 선택해 주세요.</p>
<input type="radio" name="food" value="korean">한식 <input type="radio" name="food" value="chinese">중식 <input type="radio" name="food" value="japanese">일식 <br/><br/>
<input type="reset" value="초기화"/>
<input type="submit" value="투표하기"/>
</form>
favorate_food.html
http://webclass.me/.../.../favorate_food .php?
name=heemin&food=korean
23
<?php
$db = new mysqli("localhost", "webclass", "webclass1234", "favorate_food"); //
데이터베이스 연결
if (mysqli_connect_errno()) {
print "Error: Could not connect to database server.";
exit;
}
mysqli_set_charset($db, "utf8");
$name = $_GET["name"];
$food = $_GET["food"];
$q = "select * from vote where name = '$name'";
$result = $db->query($q);
if ($result->num_rows > 0) { // already voted, 입력한 이름으로 이미 투표했는지 확 인
print "$name has already voted!"; } else {
… }
?>
Id (정수) name ( 문 자 열)
food ( 문 자 열)
p10654 sblim korean
p11237 heemin korean p13689 itdept japanese p16579 ictconv chinese
… … …
favorate_food.php
Database : favorate_food Table : vote
name=heemi n
food=korean
<?php …
$name = $_GET["name"];
$food = $_GET["food"];
…
if ($result->num_rows > 0) { … } else {
$q = "insert into vote (name, food) values ('$name', '$food')";
$db->query($q);
print "$name voted for $food";
print "<p> 음식 선호도 조사 결과 </p>";
$result = $db->query("select * from vote");
print "<br/> 총 투표자 수 : ".$result->num_rows;
$result = $db->query("select * from vote where food = 'korean'");
print "<br/> 한식: ".$result->num_rows;
$result = $db->query("select * from vote where food = 'chinese'");
print "<br/> 중식: ".$result->num_rows;
$result = $db->query("select * from vote where food = 'japanese'");
print "<br/> 일식: ".$result->num_rows;}
?>
Id (정수) name ( 문 자 열)
food ( 문 자 열)
p10654 sblim korean
p11237 heemin korean p13689 itdept japanese p16579 ictconv chinese
… … …
favorate_food.php (
계속)
name=heemi n
food=korean
Database : favorate_food Table : vote
