PHP ログイン・ログアウト機能

##フルスクラッチPHPでのログイン機能のやり方

DBとの連携でのシンプルなログイン、ログアウト
事前にMySQLにユーザー名とログイン用のメールアドレスとパスワードは登録済み
セキュリティー対策は無し

```php:login_form.php
<?php
session_start();
?>

<!DOCTYPE html>
<html>
<head>
<LINK rel="stylesheet" href="index.css">
<title>ログイン入力</title>
</head>
<body>
<h1>
<font size='5'>ログインページ</font>
</h1>

<?php if (isset($_SESSION['id'])) : ?>

<p>
<font size='5'>ようこそ</font>
</p>
<p><?php echo $_SESSION['name']; ?>さん</p>
<p><a href='logout.php'>ログアウト</a></p>

<?php else : ?>

<form action='login.php' method='post'>
<p>メールアドレス</p>
<input type='text' name='mail'>
<p>パスワード</p>
<input type='text' name='pass'>
</br>
<input class="btn" type='submit' value='ログイン'>
</form>

<?php endif; ?>

</body>
</html>
```

```css:index.css
input {
  width: 200px;
  padding: 5px;
  font-size: 18px;
  border: 2px solid #a9a9a9; 
}

.btn{
    background-color: #a9a9a9;
    margin-top: 30px;
    width: 210px;
    padding: 5px;
    border-radius: 3px;
    transition: .3s ease-out;
  }
```
##シンプルなログインフォームの完成
<img width="241" alt="スクリーンショット 2020-05-01 16.26.46.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515025/5b73148e-0582-456f-b340-098ddf7e3337.png">

```php:login.php
<?php
session_start();
$mysql    = 'mysql:host=localhost;dbname=データベース名;charset=utf8';
$user     = 'ユーザー名';
$passwoad = 'パスワード';

$mail = $_POST['mail'];
$pass = $_POST['pass'];

if (empty($mail) || empty($pass)) {
	$output = '入力してください';
} else {
	try {
		$db     = new PDO($mysql, $user, $passwoad);
		$select = "SELECT * FROM members WHERE mail = '$mail' AND pass = '$pass'";
		$res    = $db->query($select);
		$res->execute();
	} catch (PDOException $e) {
		echo '接続エラー: ' . $e->getMessage();
	}
	if ($res->rowCount() < 1) {
		$output = 'ログインできませんでした';
	} else {
		$row = $res->fetch();
		$_SESSION['id']   = $row['id'];
		$_SESSION['name'] = $row['name'];
		$_SESSION['mail'] = $row['mail'];
		$output = 'ログインできました';
	}
}
?>

<!DOCTYPE html>
<html>
<head>
<title>ログイン</title>
</head>
<body>
<h1>
<font size='5'>ログイン情報確認</font>
</h1>
<p><?php echo $output; ?></p>

<?php if (!isset($_SESSION['name'])) : ?>

<p><a href='login_form.php'>ログインページへ戻る</a></p>

<?php endif; ?>

</body>
</html>
```
##入力に不備があると
<img width="209" alt="スクリーンショット 2020-05-01 16.29.07.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515025/56975f65-f350-f0a8-1987-ace609c607bf.png">

##データベースに登録しているメールアドレス、パスワードが一致した場合
<img width="197" alt="スクリーンショット 2020-05-01 16.27.28.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515025/73a3b707-19e3-6eee-3742-2cf5c8825c27.png">

## ログインページに再び戻ると
<img width="208" alt="スクリーンショット 2020-05-01 16.27.56.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515025/f37517f2-fde8-6d11-43ae-94831617cfef.png">


```php:logout.php
<?php
session_start();
$_SESSION = array();
session_destroy();
?>

<!DOCTYPE html>
<html>
<head>
<title>ログアウト</title>
</head>
<body>
<h1>
<font size='5'>ログアウトしました</font>
</h1>
<p><a href='login_form.php'>ログインページに戻る</a></p>
</body>
</html>
```
##ログアウトを押すと
<img width="234" alt="スクリーンショット 2020-05-01 16.28.04.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/515025/9802dfde-5ca2-966c-774e-a33929e326a6.png">