PHPを使用しフォームデータをデータベース（Mysql）に挿入する

HTMLフォームを介して送信されたデータをデータベース（Mysql）にデータを保存してみます。

■環境
■レンタルサーバー「ヘテムル」のデータベース（Mysql）の設定
■HTMLフォームを作成する
1. ■コード
■データを送信し、データベース（Mysql）に保存するためのスクリプト
1. ■コード
■phpのファイルをFTPクライアントを使用し、サーバー上にアップロードする
■動作確認（スクリプトの実行）

■環境

・Windows10

・Visual Studio Code 1.53.2

・レンタルサーバー「ヘテムル」（php7.4,MySQL5.6）

・FTPクライアント「FileZilla」

■レンタルサーバー「ヘテムル」のデータベース（Mysql）の設定

データベース（Mysql）にデータを保存してみますので、まずは今回使用するヘテムルのデータベース（Mysql）の設定を行います。

「ヘテムル」のコントロールパネルのログイン（https://admin.heteml.jp/）画面で、「ヘテムルID」と「パスワード」を入力し、「ログイン」ボタンをクリックします。

クリックすると、コントロールパネルの右側にメニューがありますので、「各種設定」から「データベース」をクリックします。

クリックすると、「データベース」の管理パネルが表示されますので、「データベース作成画面へ」というボタンをクリックします。

クリックすると、「データベース作成画面」が表示されます。こちらの画面で「データベース名」と「接続パスワード」を入力します。入力後、「メモ」欄がありますので、データベースに関することのメモを入力する場合は行います。その後、「データベースを作成する」ボタンをクリックします。

クリックすると、「admin.heteml.jpの内容」というポップアップが表示されます。「データベースを作成します。よろしいですか？」というメッセージが書かれていますので、「OK」ボタンをクリックします。

クリックすると、「データベース[データベース名]の作成が完了しました」と表示されます。これでデータベースの作成は完了となります。完了後、「戻る」ボタンをクリックします。

「データベース」の管理パネルに戻りますので、作成したデータベースが表示されています。こちらの右側にある「phpMyAdmin」ボタンをクリックします。

クリックすると、「phpMyAdmin へようこそ」と表示され、「phpMyAdmin」ログインページが表示されます。表示されたページ内に「ログイン」という項目がありますので、データベースを作成した時のユーザー名とパスワードを入力します。入力後「Server Choice:」では、作成したデータベースの「サーバー名」を選択します。

選択後、「実行」ボタンをクリックします。

クリックすると、「phpMyAdmin」にログインできますので、左側のメニューから作成したデータベース名をクリックします。クリックすると、「このデータベースにはテーブルがありません。」と表示されます。こちらで「テーブルを作成」という項目がありますので、「名前:」、「カラム数：」を入力し、テーブルを作成します。

今回はテーブルの名前を「data」としカラム数を「2」と入力します。　入力後、「実行」ボタンをクリックします。

クリックすると、作成するテーブルの情報を設定する画面になります。こちらでカラムの「名前」を今回は「name」、「email」とします。次にデータ型は今回は「VARCHAR（可変長の文字列）」とします。次に「長さ/値」は、今回は「255」と入力します。入力後、その他の項目は入力なしで、「保存する」ボタンをクリックします。

クリックすると、テーブルが作成が完了となります。左側のメニューで、今回作成したデータベースの中に「data」というテーブルが表示されています。こちらをクリックし、「構造」という項目をクリックすると、作成したテーブル内のカラムなどの情報が確認できます。

■HTMLフォームを作成する

確認後、Visual Studio Codeなどのコードエディターを開き、HTMLフォームを作成していきます。

■コード

<!DOCTYPE html>
<html lang="ja">
<head>
    <title>データベースへの保存</title>
</head>
<body>
    <div style="text-align: center">
    <h1>入力フォーム</h1>
    <form action="insert.php" method="post">
    <p>
    <label for="name">name:</label>
    <input type="text" name="name" id="name">
    </p>
    <p>
    <label for="email">email:</label>
    <input type="text" name="email" id="email">
    </p>  
    <p>           
    <input type="submit" value="送信ボタン">
    </form>
    </div>

</body>
</html>

今回は上記のHTMLフォームを作成してみました。このHTMLフォームを「index.php」という名前で保存します。

■データを送信し、データベース（Mysql）に保存するためのスクリプト

では、次にデータを送信し、データベース（Mysql）に保存するためのスクリプトを書いていきます。

■コード

<!DOCTYPE html>
<html lang="ja">
<head>
    <title>MySQLへのデータ挿入</title>
</head>
<body>
    <div style="text-align: center">
    <?php
    $host = 'MySQLのサーバー名';
    $username = 'ユーザー名';
    $passwd = 'パスワード';
    $dbname = 'データベース名';

    $conn =mysqli_connect($host,$username,$passwd,$dbname);
    if($conn == false){
        die("エラー: 接続できませんでした。" . mysqli_connect_error());
    }
    $name= $_REQUEST['name'];
    $email= $_REQUEST['email'];

    $sql ="INSERT INTO data VALUES ('$name','$email')";

    if(mysqli_query($conn,$sql)){
        echo "<h3>データベースに正常に保存された。</h3>";
        echo nl2br("\n$name\n $email\n ");
    }else{
        echo "エラー: $sql. " . mysqli_error($conn);
    }
    mysqli_close($conn)
    ?>
    </div>

</body>
</html>

今回はこのようなスクリプトを作成してみました。このスクリプトを「insert.php」という名前で保存します。