[MySQL & PHP] 19장 PHP와 MySQL로 간단한 게시판 만들기

1. 간단한 게시판 만들기

1.1 간단한 게시판의 구성

지금까지 배운 MySQL과 PHP의 지식을 정리하는 의미에서 간단한 게시판을 만들어 보겠습니다. 이름 그대로 아주 간단합니다. 데이터베이스에 접속하여, '레코드 표시', '이름과 메시지 입력', '레코드 삭제', '레코드 검색'이라는 4개의 간단한 처리를 하는 웹 응용프로그램입니다.

개인 인증 없이 자유롭게 삭제하거나 할 수 있기 때문에 실제로 운용하기에는 보안 대책이 충분하진 않지만, 로컬 호스트에서 사용하기에는 아무 문제 없습니다.

이 예에서는 MySQL과 PHP의 동작을 알기 쉽게 하려고, 될 수 있는 한 적은 종류의 태그를 사용했습니다. 사용하고자 하는 HTML 태그는 print로 출력하기만 하면 됩니다. 가능하면 자신의 취향대로 디자인해보기 바랍니다.

1.2 데이터베이스와 테이블 만들기

가장 먼저, 이 웹 응용프로그램에서 사용할 테이블을 만들겠습니다. 이번에는 데이터베이스 db1에 다음과 같이 테이블  tbk 를 생성합니다.

테이블 tbk(간단한 게시판의 메시지 테이블)

칼럼 이름	number	name	mess
정의	INT  AUTO_INCREMENT  PRIMARY KEY	VARCHAR(100)	VARCHAR(100)
칼럼의 목적	메시지에서 사용할 연속 번호 저장	작성자 이름 저장	메시지 저장

테이블 tbk를 구성하는 칼럼은 번호와 이름, 메시지를 전달하는 number, name, mess입니다. 칼럼 number에는 연속 번호 기능을 설정합니다.

테이블을 만드는 방법은 기억하고 있겠지요? MySQL 콘솔창을 실행하고, 테이블 tbk를 만듭니다.

mysql -u root -p1234        (mysql 접속)

use db1        (사용할 db 지정)

create table tbk (number int auto_increment primary key, name varchar(100), mess varchar(100));        (테이블 tbk 생성)

1.3 간단한 게시판의 파일 구조

이 간단한 게시판에는 메시지를 표시하고, 추가, 삭제, 검색하는 4개의 기능이 있습니다. 각각의 기능을 PHP 스크립트로 만들어 보겠습니다.

이 장에서 만들 예제

여기에서는 다음의 PHP 스크립트 파일을 작성합니다.

맥 os의 경로

/Applications/XAMPP/htdocs/

메인 화면과 각 스크립트 파일과의 관계를 살펴보겠습니다.

메인 화면에는 4개의 폼이 있고, 각각의 폼에서 표시와 추가, 삭제, 검색 기능을 하는 스크립트를 실행할 수 있습니다. 예를 들어, 사용자가 레코드를 추가하는 경우, 텍스트 상자에 이름과 메시지를 입력하고 <확인>을 누르면, 레코드 추가 기능을 하는 simple_insert.php에 데이터가 전달됩니다.

2. 메인 화면 만들기

먼저, 메인 화면(simple.html)을 만들어 보겠습니다.

2.1 메시지를 표시하는 스크립트를 호출하는 폼

가장 먼저 표시 기능을 호출하는 폼을 만들어 보겠습니다. 테이블 tbk의 모든 레코드를 표시하는 스크립트 simple_select.php를 호출하는 폼입니다.

이 간단한 게시판에서는 POST 송신 방법인 method="post"를 설정합니다. 그리고 이 폼에 submit 기능이 있는 단추를 생성합니다. 단추에 표시되는 문자열에는 value="확인"이라고 설정합니다.

표시 기능을 호출하는 폼은 다음과 같습니다.

<form method="post" action="simple_select.php">
    메시지를 표시합니다.<br>
    <input type="submit" value="확인">
</form>

2.2 메시지를 추가하는 스크립트를 호출하는 폼

다음은 추가 기능을 호출하는 폼입니다. 레코드를 추가하는 스크립트 simple_insert.php를 호출하는 폼을 만듭니다. PHP 파일의 form 태그를 <form method="post" action="simple_insert.php">라고 작성합니다.

이름과 메시지를 입력하는 텍스트 상자를 만들고, name 속성에 '데이터를 식별하는 이름'을 설정합니다. 이번에는 이름과 메시지를 입력하는 텍스트 상자에 각각 name="a1"과 name="a2"를 설정하겠습니다.

추가 기능을 호출하는 폼은 다음과 같습니다.

<form method="post" action="simple_insert.php">
    이름 입력<input type="text" name="a1"><br>
    메시지 입력<input type="text" name="a2"><br>
    <input type="submit" value="확인">
</form>

2.3 메시지를 삭제하는 스크립트를 호출하는 폼

이번에는 삭제 기능을 호출하는 폼입니다. 레코드를 삭제하는 스크립트 simple_delete.php를 호출하는 폼을 만듭니다. 삭제할 메시지의 번호를 텍스트 상자에 입력합니다. 이 텍스트 상자에는 name="b1"을 설정합니다.

<form method="post" action="simple_delete.php">
    삭제 번호 입력<input type="text" name="b1"><br>
    <input type="submit" value="확인">
</form>

2.4 메시지를 검색하는 스크립트를 호출하는 폼

마지막으로 검색 기능을 호출하는 폼입니다. 메시지를 검색하는 스크립트 simple_search.php를 호출하는 폼을 만듭니다. 메시지에 포함되는 문자열을 검색합니다. 검색할 키워드를 텍스트 상자에 입력합니다. 이 텍스트 상자에는 name="c1"을 설정합니다.

<form method="post" action="simple_search.php">
    검색 키워드 입력<input type="text" name="c1"><br>
    <input type="submit" value="확인">
</form>

2.5 메인 화면 만들기

그럼, 앞의 내용을 정리해서 메인 화면 simple.html을 만들어 보겠습니다. 표시와 추가, 삭제, 검색 기능이 있는 PHP 스크립트를 호출하는 웹 페이지 simple.html을 만들고, 공유 폴더(여기에서는 C:\xampp\htdocs)에 저장합니다.

예제 19-1 simple.html

<meta charset="UTF-8">
 
<form method="post" action="simple_select.php">
    메시지를 표시합니다.<br>
    <input type="submit" value="확인">
</form>
 
<form method="post" action="simple_insert.php">
    이름 입력<input type="text" name="a1"><br>
    메시지 입력<input type="text" name="a2"><br>
    <input type="submit" value="확인">
</form>
 
<form method="post" action="simple_delete.php">
    삭제 번호 입력<input type="text" name="b1"><br>
    <input type="submit" value="확인">
</form>
 
<form method="post" action="simple_search.php">
    검색 키워드 입력<input type="text" name="c1"><br>
    <input type="submit" value="확인">
</form>

3. 표시와 추가, 삭제, 검색 기능 만들기

메인 화면이 완성되었습니다. 계속해서 표시와 추가, 삭제, 검색 기능을 담당하는 부분을 만들어 보겠습니다.

3.1 데이터베이스 접속과 선택, 종료 - 공통 부분

이번에는 메인 화면에서 호출되는 PHP 파일을 만들겠습니다. 표시와 추가, 삭제, 검색을 하는 4개의 스크립트 모두 '데이터베이스 접속'과 '모든 레코드 표시', '데이터베이스 종료'를 실행합니다. 이 공통된 3개의 기능을 하는 스크립트에 대해 생각해 봅시다.

먼저, 데이터베이스에 접속하고 접속을 종료하는 스크립트는 '18장의 1.1 PHP로 MySQL 서버에 접속하기' 와 같고, 데이터베이스를 선택하는 스크립트는 '18장의 데이터베이스 db1 지정하기'와 같습니다. 공통 부분은 다음과 같습니다.

<?php 
    $s = mysql_connect("localhost", "root", "1234") or die("실패입니다.");
    print "접속 OK!<br>";
    mysql_select_db("db1");
 
    // ..기능별 스크립트...
 
    mysql_close($s);
    print "<br><a href='simple.html'>메인 화면으로</a>";
 ?>

3.2 레코드를 표시하는 PHP 스크립트

먼저, 단추를 누르면 테이블 tbk의 모든 레코드를 표시하는 PHP 스크립트에 대해 생각해 봅시다. 일단, SQL 문은 SELECT * FROM tbk라고 하면 됩니다. 그러나 이렇게 하면 표시되는 순서를 알 수가 없습니다. 그래서 여기에서는 칼럼 number의 순서에 따라 표시되도록 ORDER BY number를 추가하겠습니다. SQL 문을 실행하고 결과를 표시하는 스크립트는 '18장의 2.6 레코드를 추가하고 데이터 표시하기'와 같습니다.

예제 19-2 simple_select.php

<?php 
    $s = mysql_connect("localhost", "root", "1234") or die("실패입니다.");
    print "접속 OK!<br>";
    mysql_select_db("db1");
    $re = mysql_query("SELECT * FROM tbk ORDER BY number");
    while ($result = mysql_fetch_array($re)) {
        print $result[0];
        print " : ";
        print $result[1];
        print " : ";
        print $result[2];
        print "<br>";
    }
    mysql_close($s);
    print "<br><a href='simple.html'>메인 화면으로</a>";
 ?>

simple_select.php라는 파일 이름으로 공유 폴더에 저장합니다.

3.3 레코드를 추가하는 PHP 스크립트

이번에는 이름과 메시지를 추가하는 스크립트입니다.

메인 화면에 있는 name="a1"과 name="a2"라는 텍스트 상자에는 이름과 메시지가 입력됩니다. 레코드 추가용 스크립트 simple_insert.php에서는 이 2개의 데이터를 전달받아 칼럼 name과 mess에 추가합니다.

simple.html에서 전달하는 데이터는 $_POST["a1"]과 $_POST["a2"]에 저장됩니다. 전달받은 2개의 데이터 $_POST["a1"]과 $_POST["a2"]는 큰따옴표(")와 작은따옴표(')를 여러 번 사용하면 구조가 복잡해지기 때문에, 이를 각각 $a1_d와 $a2_d라는 변수에 대입합니다.

전달받은 데이터를 테이블 tbk의 칼럼 name과 mess에 추가하는 SQL 문은 다음과 같습니다.

INSERT INTO tbk (name, mess) VALUES('$a1_d', '$a2_d')

결국, 이 SQL 문을 실행하는 부분은 다음과 같습니다.

$a1_d = $_POST["a1"];

$a2_d = $_POST["a2"];

mysql_query("INSERT INTO tbk (name, mess) VALUES('$a1_d', '$a2_d')");

SQL 문의 INSERT INTO ... VALUES('$a1_d', '$a2_d')의 바깥쪽을 큰따옴표(")로 감쌀때 주의하도록 합니다. 바깥쪽을 큰따옴표(")로 감싸면 안쪽의 변수 $a1_d와 $a2_d의 값이 전개되어 구체적인 문자열로 처리됩니다.

그럼데 '$a1_d'에 작성한 작은따옴표(')는 괜찮을까요? 작은따옴표(')로 감싼 변수는 그대로 문자열로 취급된다고 배웠습니다. 하지만 '18장의 2.3 변수에 사용하는 큰따옴표와 작은따옴표의 차이'에서도 설명했지만, 큰따옴표(")를 사용하는 순간 작은따옴표(')는 단순한 문자로 인식됩니다. 그렇기 때문에, 예를 들어 변수 $a1_d에 박문수가 대입되면 단순하게 다음과 같이 문자로서 처리됩니다.

INSERT INTO ... VALUES ('박문수')

지금까지 설명한 내용에 데이터베이스에 접속하고, 레코드를 표시하고, 데이터베이스 접속을 종료하는 공통 부분을 정리하면 예제 19-3과 같습니다.

예제 19-3 simple_insert.php

<?php 
    $s = mysql_connect("localhost", "root", "1234") or die("실패입니다.");
    print "접속 OK!<br>";
    mysql_select_db("db1");
    $a1_d = $_POST["a1"];
    $a2_d = $_POST["a2"];
    mysql_query("INSERT INTO tbk (name, mess) VALUES('$a1_d', '$a2_d')");
    $re = mysql_query("SELECT * FROM tbk ORDER BY number");
    while ($result = mysql_fetch_array($re)) {
        print $result[0];
        print " : ";
        print $result[1];
        print " : ";
        print $result[2];
        print "<br>";
    }
    mysql_close($s);
    print "<br><a href='simple.html'>메인 화면으로</a>";
 ?>

simple_insert.php를 작성하여 공유 폴더에 저장합니다.

3.4 레코드를 삭제하는 PHP 스크립트

다음은 레코드를 삭제하는 스크립트입니다.

텍스트 상자 name="b1"에 입력된 데이터를 simple_delete.php에서 전달받아, 테이블 tbk의 칼럼 number와 일치하는 레코드를 삭제합니다.

simple.html에서 보내온 데이터는 $_POST["b1"]에 전달됩니다. 이 데이터를 일단 변수 $b1_d에 대입합니다.

칼럼 number가 변수 $b1_d의 값과 일치하는 레코드를 삭제하는 SQL 문은 DELETE FROM tbk WHERE number=$b1_d입니다. 따라서, 이 SQL 문을 실행하는 부분은 다음과 같습니다.

$b1_d = $_POST["b1"];

mysql_query("DELETE FROM tbk WHERE number=$b1_d");

여기까지의 내용을 다른 공통 부분과 함께 정리하면 예제 19-4와 같습니다.

예제 19-4 simple_delete.php

<?php 
    $s = mysql_connect("localhost", "root", "1234") or die("실패입니다.");
    print "접속 OK!<br>";
    mysql_select_db("db1");
    $b1_d = $_POST["b1"];
    mysql_query("DELETE FROM tbk WHERE number=$b1_d");
    $re = mysql_query("SELECT * FROM tbk ORDER BY number");
    while ($result = mysql_fetch_array($re)) {
        print $result[0];
        print " : ";
        print $result[1];
        print " : ";
        print $result[2];
        print "<br>";
    }
    mysql_close($s);
    print "<br><a href='simple.html'>메인 화면으로</a>";
 ?>

simple_delete.php를 작성하여 공유 폴더에 저장합니다.

3.5 레코드를 검색하는 PHP 스크립트

마지막으로, 입력한 문자열이 칼럼 mess에 포함되어 있는지 검색하는 스크립트입니다.

simple_search.php에서 텍스트 상자 name="c1"에 입력된 데이터를 전달받아, 칼럼 mess에서 그 문자열을 포함하는 레코드를 검색합니다.

simple.html에서 보내온 데이터는 $_POST["c1"]에 전달되어 변수 $c1_d에 대입됩니다.

칼럼 mess에 변수 $c1_d의 값을 포함하는 레코드가 있는지 검색하는 SQL 문은 조금 복잡합니다. 'ХХ가 칼럼 mess의 데이터 중에 포함된다.'라는 조건은 'ХХ의 앞뒤에는 어떤 데이터가 있어도 상관 없다.'라는 의미이기 때문에 mess LIKE '%ХХ%'를 사용합니다. 따라서 칼럼 mess에서 변수 $c1_d의 값을 포함하는 레코드를 검색하는 SQL 문은 다음과 같습니다.

SELECT * FROM tbk WHERE mess LIKE '%c1_d%'

그리고 검색한 결과를 표시하기 위해 mysql_query() 함수로 실행한 SQL 문의 결과를 변수에 저장합닏. 이 부분을 스크립트로 작성하면 다음과 같습니다.

$c1_d = $_POST["c1"];

$re = mysql_query("SELECT * FROM tbk WHERE mess LIKE '%$c1_d%'");

지금까지의 내용을 다른 공통 부분과 함께 정리해서 스크립트로 작성하면 예제 19-5와 같습니다.

예제 19-5 simple_search.php

<?php 
    $s = mysql_connect("localhost", "root", "1234") or die("실패입니다.");
    print "접속 OK!<br>";
    mysql_select_db("db1");
    $c1_d = $_POST["c1"];
    $re = mysql_query("SELECT * FROM tbk WHERE mess LIKE '%$c1_d%'");
    while ($result = mysql_fetch_array($re)) {
        print $result[0];
        print " : ";
        print $result[1];
        print " : ";
        print $result[2];
        print "<br>";
    }
    mysql_close($s);
    print "<br><a href='simple.html'>메인 화면으로</a>";
 ?>

simple_search.php를 작성하여 공유 폴더에 저장합니다.

3.6 4개 파일의 동작 확인하기

simple.html과 simple_select.php, simple_insert.php, simple_delete.php, simple_search.php 파일의 모두 공유 폴더에 저장했다면, MySQL과 Apache가 실행중인지 확인하고 나서 이 간단한 게시판을 실행해 보겠습니다.

브라우저 주소창에 http://localhost/simple.html을 입력하면 다음과 같이 간단한 게시판의 메인 화면이 표시됩니다.

게시판에 태그를 입력한다?!

가끔, 태그와 함께 메시지를 입력하면, 해당 태그가 반영되어 버리는 난감한 게시판이 있습니다. 이런 게시판이 실제로 웹상에서 사용되고 있다면 정말 곤란하겠지요. 여기에서 소개한 간단한 게시판도 이러한 게시판 중 하나입니다.

예를 들어, simple.html에서 입력한 메시지 중에 <font size="7" color="red">난감한 게시판!</font>와 같이 태그가 포함되어 있으면, 입력한 태그가 그대로 반영되어 버립니다.

텍스트를 디자인하는 정도라면 큰 피해는 없겠지만, 태그가 반영된다는 것은 사용자가 스크립트를 이용해서 의도하지 않은 동작을 일으킬 수 있습니다.

단순하게 문자열을 출력하는 구조라면, 전송한 태그도 모두 반영됩니다.

정리

이 장에서는 다음과 같은 내용을 알아보았습니다.

1. PHP와 MySQL을 사용하여 웹 응용프로그램 작성하기

2. 표시와 추가, 삭제, 검색 기능이 있는 스크립트를 호출하는 폼 작성하기

3. 표시와 추가, 삭제, 검색 기능이 있는 스크립트 작성하기

체크!

★ PHP와 MySQL을 이용하여 웹 응용프로그램을 만드는 과정을 이해하고 있다.

★ 자신만의 간단한 게시판을 만들 수 있다.