ログアウトするボタンを設置する
前回は掲示板に書き込まれた投稿を削除するページを作成しました。
今回は管理ページからログアウトをする機能を実装していきます。
以下のように、管理ページの下部にログアウトボタンを設置します。
こちらのボタンを押すとログアウトを実行し、ログインページに移動します。
「ひと言掲示板を作る」の概要については「ひと言掲示板を作る」をご覧ください。
デモはこちら
前回までに作成したコードはこちら:Github
ログアウトの仕組み
管理ページはログインした際に次のようなセッションを作成しました。
admin.php
$_SESSION['admin_login'] = true;
現在はこのログインセッション$_SESSION['admin_login']の値でログイン状態を判断し、ログイン済みの場合は管理ページを表示して、そうでない場合にはログインページを表示するようになっています。
そこで、ログアウトの処理ではこのログインセッションを明示的に削除する形で実装します。
特定のセッションの削除は変数の削除と同様にunset関数を使用します。
PHP コード例
unset($_SESSION['admin_login']);
以上の仕組みを踏まえて、実際にログアウトボタンを設置していきましょう。
ログアウトボタンを設置する
まずはログアウトボタンをHTMLとして追記します。
「admin.php」を開き、以下のコードを追記してください。
admin.php
<?php
---- 省略 ----
<?php if( !empty($message_array) ){ ?>
<?php foreach( $message_array as $value ){ ?>
<article>
<div class="info">
<h2><?php echo htmlspecialchars($value['view_name'], ENT_QUOTES, 'UTF-8'); ?></h2>
<time><?php echo date('Y年m月d日 H:i', strtotime($value['post_date'])); ?></time>
<p><a href="edit.php?message_id=<?php echo $value['id']; ?>">編集</a> <a href="delete.php?message_id=<?php echo $value['id']; ?>">削除</a></p>
</div>
<p><?php echo nl2br( htmlspecialchars( $value['message'], ENT_QUOTES, 'UTF-8') ); ?></p>
</article>
<?php } ?>
<?php } ?>
<form method="get" action="">
<input type="submit" name="btn_logout" value="ログアウト">
</form>
<?php else: ?>
---- 省略 ----
追加したform要素の中に送信ボタンとしてログアウトを設置しました。
ログアウト自体には特別な情報のデータを含まないので、GETパラメータとして送信するようにします。
続いて、CSSにもログアウトボタンのための追記を行います。
admin.php
---- 省略 ----
input[type="submit"] {
appearance: none;
-webkit-appearance: none;
padding: 10px 20px;
color: #fff;
font-size: 86%;
line-height: 1.0em;
cursor: pointer;
border: none;
border-radius: 5px;
background-color: #37a1e5;
}
input[type=submit]:hover {
background-color: #2392d8;
}
input[name=btn_logout] {
margin-top: 40px;
background-color: #666;
}
input[name=btn_logout]:hover {
background-color: #777;
}
hr {
margin: 20px 0;
padding: 0;
}
---- 省略 ----
以上でログアウトボタンの設置が完了しました。
試しにログインした後の管理ページ(admin.php)を表示すると、ページ下部に灰色のログアウトボタンが表示されます。
ログインセッションを削除する
続いて、PHPでセッションの削除を行います。
admin.php
<?php
---- 省略 ----
session_start();
if( !empty($_GET['btn_logout']) ) {
unset($_SESSION['admin_login']);
}
// データベースに接続
try {
---- 省略 ----
まずはempty関数でGETパラメータ「btn_logout」が渡されているかを確認します。
このGETパラメータが渡されている場合はログアウトボタンが押されたと判断して、if文の中でunset関数を実行します。
ここでログインセッションは削除されます。
その後はログインセッションがない状態で処理が進むため、結果としてログインページが表示されます。
以上でログアウトするための機能が実装できました。
実際にログアウトができるか試してみてください。
今回作成したコード:Github