PHP

PHPとMySQLで投票アプリを作る【モンハンランキング】

PHPとMySQLを使って「投票機能」のあるwebアプリを作りました。

リンク(画像)をクリックすると「データベースが更新されて最新の投票数が表示される」というwebアプリです。

エックスサーバー に、自分のデータベースを作りそのデータを表示してみました。

 

完成したサイトは以下です。

モンハンライズのランキング

 

 

この記事では、データベース(MySQL)を使ったwebアプリの作り方GETメソッドを使った投票のしくみをまとめていきます。

 

 

まずは、データベースのデータをHTMLで表示してみます。

①データベースを作る

まずは、投票数などのデータを保持しておくデータベースを作ります。

 

①データベースの作成(アクセス権の設定)

データベースを作成し、アクセス権の設定を行います。

詳細は エックスサーバーでデーターベース(MySQL)を追加する全手順 をご覧ください。

 

 

②phpMyAdminでデータベースの設定

データベースを作ったら、phpMyAdminでデータベースの設定をします。

phpMyAdminへのログインが必要です。

詳細は エックスサーバーでphpMyAdminへログインする方法 をご覧ください。

 

 

データベースができたらその中にテーブルを作ります。

②phpMyAdminでテーブルを作る

テーブルは、phpMyAdminで作ります。

phpMyAdminとは、GUIでデータベースを操作できるwebアプリです。

 

テーブル名やカラム名やデータ型を指定して、テーブルを作ります。

CREATE TABLE `appmhr`.`weapon` (
`weapon_id` INT(11) NOT NULL AUTO_INCREMENT,
`weapon_name` VARCHAR(64) NOT NULL,
`weapon_votes` INT(11) NOT NULL,
PRIMARY KEY (`weapon_id`)
)
ENGINE = InnoDB COMMENT = '好きな武器ランキング用';

 

テーブルを作ったら、表示テスト用のデータも入れておきます。

INSERT INTO `weapon`(`weapon_id`, `weapon_name`, `weapon_votes`) VALUES
(1, '大剣', 5),
(2, '片手剣', 2),
(3, '双剣', 3);

 

 

 

③作成したテーブルのデータをHTMLで表示する

テーブルに表示テスト用の値を入れたら、PHPとHTMLで表示してみます。

以下のように、テーブルから取得した値をaタグで表示してみます。

<a href="?vote=up&amp;id=1">大剣:5</a>
<a href="?vote=up&amp;id=2">片手剣:2</a>
<a href="?vote=up&amp;id=3">双剣:3</a>

 

データベースと接続するスクリプト

データベースと接続をするためのスクリプトを作ります。

index.php とは別ファイル(core/init.php)で保存しておきます。

<?php
$host = "サーバー名";
$username = "ユーザー名";
$password = "パスワード";
$dbname = "データベース名";

$mysqli = new mysqli($host, $username, $password, $dbname);
$mysqli->set_charset("utf8");

if ($mysqli->connect_error) {
	error_log($mysqli->connect_error);
	exit;
}

 

データベースの値を表示するHTML

データベースの値を表示するためのPHPスクリプトとHTMLです。

<?php
require_once( 'core/init.php' );
?>

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>PHP:getを使った投票機能</title>
</head>

<body>

<?php
// データベースからデータを取得する
$query = "SELECT weapon_id, weapon_name, weapon_votes FROM weapon";
$result = $mysqli->query($query);

// 1行ずつ繰り返しデータを取得する
while ( $row = $result->fetch_assoc() ) { ?>

	<!-- <a href="?vote=up&id=1">大剣</a> -->
	<a href="?vote=up&amp;id=<?php echo $row["weapon_id"] ?>">

		<!-- 武器名を表示 -->
		<?php echo $row["weapon_name"]; ?>:

		<!-- 投票数を表示 -->
		<?php echo $row["weapon_votes"]; ?>

	</a>
	<br />
<?php } // End of While ?>

</body>
</html>

 

headタグの上に、データベースと接続するためのスクリプト init.php をインポートします。

body内で、SQLの作成と実行をしてデータを取得、繰り返し文で1行ずつHTMLに変換します。

 

 

次に、投票機能です。

投票機能のしくみ

投票数を表示するには、どの要素が選択されたか判別する必要があります。

その判別には、HTTP通信のGETメソッドを利用します。

GETメソッドは「URLの後ろに値をつけてサーバに送る」ことができます。

aタグ(リンク)のhref属性に「URLパラメータ」を付けておくことで、リンクがクリックされると、「URLパラメータ」がサーバに送信されます。

その値によってデータを判別し、データの更新を行うしくみとなっています。

 

 

aタグのhref属性にURLパラメータを振る

こちらがURLパラメータを指定した3つのリンクのサンプルコードです。

<a href="?vote=up&amp;id=1">A</a>
<a href="?vote=up&amp;id=2">B</a>
<a href="?vote=up&amp;id=3">C</a>

 

URLパラメータは、?から始まり、&でつなげて複数のパラメータを付与できます。

&文字は特殊文字なので、そのままではHTMLで表示できません。

&amp; とすることで & を表現しています。

 

 

次に、GETメソッドのしくみについて紹介します。

GETメソッド

PHPでは、リンクがクリックされた時(HTTPリクエストが行われた時)に、その情報をスーパーグローバル変数 $_GET に持つことができます。

 

そこで、index.php に以下のスクリプトを仕込んでおきます。

// getメソッドが発生した時に、update_vote()を実行する
if ($_GET) {
	update_vote($mysqli);
}

 

$_GET に値がある場合には、関数 update_vote() を実行せよ!

ということです。

 

詳しくは、php.netの PHP: $_GET – Manualを参照ください。

 

 

次に、update_vote()の具体的な内容です。

update_vote()

update_vote() は以下のコードです。

function update_vote($mysqli){
    $id = $_GET['id'];

    // GETが実行されたときに下記を実行
    if ( isset($_GET['vote'], $_GET['id']) ) {
        $query = "UPDATE taikens SET votes = votes + 1 WHERE id = $id";
        $mysqli->query($query);        
    }
}

 

まず、どのidがクリックされたか判定するため、スーパーグローバル変数 $_GET[id]の値を取得しておきます。

[id] の部分は、href属性で指定した id= の値が取れます。

 

つぎに、 isset関数$_GET['vote']$_GET['id'] に値がセットされているか確認し、セットされていれば、クエリを実行してデータベースの値を更新させます。

 

isset関数の詳細は、php.netの PHP: isset – Manualを参照ください。

 

 

SQLクエリと実行方法

データベースの更新は、以下のクエリを実行することで行います。

UPDATE taikens SET votes = votes + 1 WHERE id = $id

 

UPDATE構文の構成です。

UPDATE テーブル名 SET カラム名 = 処理 WHERE カラム名 = 値

 

PHPでは、クエリを実行してデータベースの操作を行うことができるのです。

クエリの実行は、$mysqli->query(クエリ) で行います。

 

 

 

以上です。

今回は、データベースを使った投票アプリの作り方をご紹介しました。

このような動的なwebアプリは、レンタルサーバーがあれば簡単に作れます。

初心者の方もぜひ挑戦してみて下さい。

レンタルサーバーのおすすめは、国内シェアNo.1のエックスサーバーです。