Kontaktieren Sie uns Formular – PHP & MySQL

Demo

Fast jede Website verfügt über eine Seite, auf der Besucher mit dem Administrator oder Eigentümer der Website interagieren können. Diese Seite wird normalerweise als „Kontakt“ bezeichnet. Der Zweck dieser Seite ist es, Probleme und Verwirrungen von Besuchern zu lösen, die Schwierigkeiten haben, die Website zu nutzen. Wenn Sie Dienstleistungen online anbieten, ist dies ein großartiges Tool, um benutzerdefinierte Bestellungen von Besuchern zu erhalten und Ihre Besucher zu echten Kunden zu machen. Wie bereits erwähnt, ist dies für fast jede Website erforderlich. Wir zeigen Ihnen daher, wie Sie diese Seite für Ihre Website erstellen können.

Was macht unsere Seite „Kontakt“?

Die Kontaktseite, die wir entwerfen und entwickeln werden, sendet ein E-Mail an den Administrator oder Eigentümer der Website (Sie) und speichert den Datensatz für die zukünftige Verwendung in der Datenbank. Wir werden es auch mit CSRF (Cross-Side Request Forgery) vor Spam schützen. Da es sich um eine Kontaktseite handelt und jeder Hacker weiß, dass beim Absenden dieses Formulars entweder eine E-Mail gesendet oder ein Eintrag in die Datenbank vorgenommen wird. So kann jemand ein Skript erstellen, das die Anforderung 1000 Mal auf dem Server sendet und zum Absturz Ihres Servers führen kann. Hier werden CSRF-Token verwendet, die wir in unserem Kontaktformular verwenden werden. Außerdem werden wir die Funktionalität hinzufügen, um die ungelesenen Nachrichten hervorzuheben, und eine Schaltfläche für den Administrator erstellen, um jede Nachricht als gelesen zu markieren. Wir werden auch die Funktion zum Löschen der Nachricht aus der Datenbank hinzufügen, da manchmal irrelevante Werbe-E-Mails gesendet werden.

Datenbank

Zuerst erstellen wir eine MySQL-Tabelle in unserer Datenbank. Angenommen, Sie haben bereits eine Datenbank, können Sie einfach Ihren phpMyAdmin öffnen und die folgende Abfrage einfügen:

CREATE TABLE IF NOT EXISTS inbox (
    id INTEGER NOT NULL PRIMARY KEY AUTO_INCREMENT,
    name TEXT NOT NULL,
    email TEXT NOT NULL,
    message TEXT NOT NULL,
    is_read BOOLEAN NOT NULL,
    created_at DATETIME NOT NULL
);

Dadurch wird eine Tabelle mit dem Namen „Posteingang“ erstellt, falls diese noch nicht vorhanden ist. Wenn Sie bereits eine Tabelle mit diesem Namen haben und diese für ein anderes Modul verwenden, können Sie den Namen ändern, der am besten zu Ihnen passt und für Sie leicht zu merken ist. Diese Tabelle verfügt über eine automatische Inkrement-ID, mit der jede von Benutzern empfangene Nachricht eindeutig identifiziert wird. Name, E-Mail und Nachricht, die einfache Textattribute sind und eine ist gelesen Feld. In diesem Feld werden die ungelesenen Nachrichten hervorgehoben. Ungelesene Nachrichten haben dieses Attribut als 0 und gelesene Nachrichten haben 1. Letzte ist die hergestellt in Attribut: Wenn Sie jemals an Laravel gearbeitet haben, ist Ihnen dieses Attribut höchstwahrscheinlich bekannt. Dieses Attribut enthält das Datum und die Uhrzeit, zu der dieser Eintrag vorgenommen wird, dh das Datum und die Uhrzeit, zu der die Nachricht vom Kontaktformular gesendet wird.

Erstellen Sie ein Formular

<?php
    session_start();
?>

<form method="POST" action="contact.php">
    <?php
        $_token = md5(time());
        $_SESSION["_token"] = $_token;
    ?>
    <input type="hidden" name="_token" value="<?php echo $_token; ?>" />

    <p>
        <label>Name</label>
        <input type="text" name="name" required>
    </p>

    <p>
        <label>Email</label>
        <input type="email" name="email" required>
    </p>

    <p>
        <label>Message</label>
        <textarea name="message" required></textarea>
    </p>

    <p>
        <input type="submit" name="contact_us" value="Send message">
    </p>
</form>

Zuerst starten wir die PHP-Sitzung. Wir benötigen die PHP-Sitzungen für CSRF-Token. Anschließend haben wir ein Formular mit einer POST-Methode und einer Aktion für die Seite erstellt, auf der wir dieses Formular verarbeiten werden. Dann erstellen wir ein CSRF-Token. Wir erstellen es, indem wir den aktuellen Zeitstempel in md5-Hash konvertieren, wodurch eine starke Hash-Zeichenfolge erstellt wird. Anschließend speichern wir diese in der in PHP integrierten Sitzungsvariablen, damit wir sie auf der nächsten Seite verwenden können. Stellen Sie sicher, dass Sie die Sitzung gestartet haben, bevor Sie eine Sitzungsvariable verwenden. Das erstellte Token muss auch in einem versteckten Eingabefeld im Formular gespeichert werden, damit es zusammen mit anderen Feldern gesendet wird. Das Formular enthält den Namen, die E-Mail-Adresse und die Nachricht des Benutzers sowie eine Schaltfläche zum Senden, über die das Formular beim Klicken gesendet wird.

Verarbeiten Sie das Formular

Erstellen Sie eine neue Datei mit dem Namen „contact.php”Oder was auch immer der Wert ist, den Sie dem Aktionsattribut im vorherigen Schritt gegeben haben, und fügen Sie den folgenden Code ein. Wir werden jeden Schritt erklären:

<?php
    session_start();

    // check if the form submits
    if (isset($_POST["contact_us"]))
    {
        $_token = $_POST["_token"];

        // check CSRF token
        if (isset($_SESSION["_token"]) && $_SESSION["_token"] == $_token)
        {
            // remove the token so it cannot be used again
            unset($_SESSION["_token"]);

            // connect with database
            $conn = mysqli_connect("localhost:8889", "root", "root", "yourdbname");

            // get and validate input fields from SQL injection
            $name = mysqli_real_escape_string($conn, $_POST["name"]);
            $email = mysqli_real_escape_string($conn, $_POST["email"]);
            $message = mysqli_real_escape_string($conn, $_POST["message"]);
            $is_read = 0;

            // sending email
            $headers="From: YourWebsite <[email protected]>" . "rn";
            $headers .= 'MIME-Version: 1.0' . "rn";
            $headers .= 'Content-type: text/html; charset=iso-8859-1' . "rn";
            
            $to = "[email protected]";
            $subject = "New Message";

            $body = "<h1>Message from:</h1>";
            $body .= "<p>Name: " . $name . "</p>";
            $body .= "<p>Email: " . $email . "</p>";
            $body .= "<p>Message: " . $message . "</p>";

            mail($to, $subject, $body, $headers);

            // saving in database
            $sql = "INSERT INTO inbox(name, email, message, is_read, created_at) VALUES ('" . $name . "', '" . $email . "', '" . $message . "', " . $is_read . ", NOW())";
            mysqli_query($conn, $sql);

            echo "<p>Your message has been received. Thank you.</p>";
        }
        else
        {
            echo "<p>Something went wrong.</p>";
        }
    }
?>

Zuerst haben wir die Sitzung gestartet, damit wir das CSRF-Token überprüfen können, und dann prüfen wir, ob das Formular gesendet wurde. Dann validieren wir das Formular unter CSRF (Cross-Side Request Forgery). Wenn das Token in der Sitzung mit dem Wert des ausgeblendeten Eingabefelds übereinstimmt, bedeutet dies, dass die Anfrage von Kontakt an uns gesendet wird und in Ordnung ist, verarbeitet zu werden. Andernfalls wird eine Nachricht angezeigt „Etwas ist schief gelaufen“. In der nächsten Zeile entfernen wir das Token aus der Sitzungsvariablen, damit es nicht erneut verwendet werden kann. Dann verbinden wir uns mit der Datenbank. Dann erhalten wir alle Eingabefelder in separaten Variablen und validieren jedes Feld unter einem SQL-Injection-Angriff mit integriertem PHP mysqli_real_escape_string. Wir haben auch eine Variable is_read und ihr Wert ist auf 0 gesetzt, so dass standardmäßig alle eingehenden Nachrichten als ungelesen markiert werden.

Dann senden wir eine E-Mail an den Administrator. Header werden verwendet, um zusätzliche Informationen zu senden, aber hier verwenden wir sie insbesondere, weil unsere E-Mail HTML-Tags enthält. Sie können die E-Mail-Adresse angeben, in der Sie empfangen möchten $ bis Variable. Stellen Sie die $ subject von E-Mail nach Wunsch. Ebenso können Sie den Inhalt von E-Mails in festlegen $ body Variable. Wir zeigen alle Eingabefeldwerte im E-Mail-Text an. Um eine E-Mail zu senden, verwenden wir PHP Mail Funktion, aber wenn Sie in localhost testen, müssen Sie die PHPMailer-Bibliothek verwenden. Sie können lernen, wie Sie PHPMailer in verwenden dieser Beitrag.

Schließlich speichern wir den Datensatz in der MySQL-Datenbank. Sie müssen nur alle Felder in die INSERT-Abfrage-VALUES-Klausel eingeben und auch eine Variable is_read. Das Feld created_at enthält den Wert des aktuellen Datums und der aktuellen Uhrzeit, die über die in MySQL integrierte Funktion abgerufen werden können JETZT(). Anschließend wird die Abfrage ausgeführt und dem Benutzer eine Erfolgsmeldung angezeigt. Wenn alles gut geht, sehen Sie eine neue E-Mail in Ihrem Posteingang und eine neue Zeile in der Posteingangstabelle Ihrer phpMyAdmin-Datenbank.

Posteingang im Admin-Bereich anzeigen

Erstellen Sie in Ihrem Admin-Bereich eine Datei mit dem Namen „inbox.php”Und alle Einträge aus dem Kontaktformular anzeigen. Markieren Sie die ungelesenen Nachrichten und fügen Sie 2 Schaltflächen hinzu. als gelesen markieren und löschen.

<?php
    // connect with database
    $conn = mysqli_connect("localhost:8889", "root", "root", "yourdbname");

    // get all inbox messages such that latest messages are on top
    $sql = "SELECT * FROM inbox ORDER BY id DESC";
    $result = mysqli_query($conn, $sql);

?>

    <style>
        table, th, td {
            border: 1px solid black;
            border-collapse: collapse;
        }
        th, td {
            padding: 10px;
        }
    </style>

    <table class="table">

        <tr>
            <th>Name</th>
            <th>Email</th>
            <th>Message</th>
            <th>Actions</th>
        </tr>

<?php while ($row = mysqli_fetch_object($result)): ?>
        <tr style="<?php $row->is_read ? '' : 'background-color: lightgray;'; ?>">
            <td><?php echo $row->name; ?></td>
            <td><?php echo $row->email; ?></td>
            <td><?php echo $row->message; ?></td>
            <td>
                <?php if (!$row->is_read): ?>
                    <form method="POST" action="mark-as-read.php" onsubmit="return confirm('Are you sure you want to mark it as read ?');">
                        <input type="hidden" name="id" value="<?php echo $row->id; ?>">
                        <input type="submit" value="Mark as read">
                    </form>
                <?php endif; ?>

                <form method="POST" action="delete-inbox-message.php" onsubmit="return confirm('Are you sure you want to delete this ?');">
                    <input type="hidden" name="id" value="<?php echo $row->id; ?>">
                    <input type="submit" value="Delete">
                </form>
            </td>
        </tr>
<?php endwhile; ?>

    </table>

Dadurch wird eine Verbindung zur Datenbank hergestellt und alle Nachrichten aus der Posteingangstabelle werden in absteigender Reihenfolge nach ID sortiert, sodass die neuesten Nachrichten oben angezeigt werden. Erstellen Sie ein Tabellen-Tag und erstellen Sie darin eine Zeile für Überschriften. Wir haben auch CSS angewendet, damit es gut aussieht. Rand gibt eine Linie auf allen vier Seiten der Tabelle. Grenzkollaps entfernt die doppelten Ränder zwischen den Tags th und td. Polsterung wird nur auf th & td angewendet, wodurch ein gewisser Abstand zwischen Rand und Inhalt von th & td entsteht. Dann erstellen wir eine Schleife für alle aus der Abfrage abgerufenen Datensätze. Für jeden Datensatz erstellen wir eine Tabellenzeile

und in jeder Tabellenzeile werden Name, E-Mail und Nachricht angezeigt. Wenn der Nachrichtenstatus ungelesen ist, setzen wir die Hintergrundfarbe der Tabellenzeile auf hellgrau nur um es unter anderen Zeilen hervorzuheben.

In der letzten Spalte erstellen wir zwei Formulare. um eine bestimmte Nachricht als gelesen zu markieren und die Nachricht zu löschen. Das erste Formular wird unter der Bedingung erstellt, dass bei einem ungelesenen Nachrichtenstatus keine Nachricht als gelesen markiert werden muss, wenn die Nachricht bereits gelesen wurde. Die zweite Form besteht darin, die Nachricht aus der Datenbank zu löschen. Vor dem Absenden dieser Formulare möchten wir ein Bestätigungsfeld anzeigen. Wenn der Benutzer versehentlich auf die Schaltfläche Löschen klickt, sollte er den Benutzer zur Bestätigung auffordern und die Nachricht nicht sofort löschen. In beiden Formularen haben wir ein Attribut hinzugefügt onsubmit. Dies ist ein Ereignis, das aufgerufen wird, wenn das Formular gesendet und ein Javascript-Code ausgeführt wird. Wir müssen true oder false zurückgeben, true zurückgeben, um das Formular zu senden, und false, um das Senden des Formulars zu verhindern. In Javascript haben wir eine eingebaute Funktion bestätigenDies zeigt ein Eingabeaufforderungsfeld mit 2 Schaltflächen „Ja“ oder „Nein“. Wenn der Benutzer Ja drückt, wird true zurückgegeben, andernfalls wird false zurückgegeben. Wenn Sie also auf die Schaltfläche „Senden“ klicken, wird eine Bestätigung angefordert. Wenn Sie nur „Ja“ drücken, wird die Anforderung an die nächste Seite gesendet.

Nachricht als gelesen markieren

Erstellen Sie eine Datei mit dem Namen „mark-as-read.php”In Ihrem Admin-Bereich. Hier setzen wir einfach den Status der Nachricht, um eine Erfolgsnachricht zu lesen und anzuzeigen.

<?php
    // connect with database
    $conn = mysqli_connect("localhost:8889", "root", "root", "yourdbname");

    // prevent from SQL injection
    $id = mysqli_real_escape_string($conn, $_POST["id"]);
    
    // set the message as read
    $sql = "UPDATE inbox SET is_read = 1 WHERE id = " . $id;
    mysqli_query($conn, $sql);

    // display a success message
    echo "<p>Message has been marked as read.</p>";
?>

Zuerst verbinden wir uns mit der Datenbank. Dann erhalten wir die ID aus dem versteckten Eingabefeld und validieren sie auch aus der SQL-Injection. Dann führen wir eine Abfrage aus, um die festzulegen ist gelesen Wert auf 1 unter Verwendung der eindeutigen ID. Schließlich wird eine einfache Erfolgsmeldung angezeigt. Wenn Sie den Posteingang das nächste Mal in Ihrem Admin-Bereich sehen, wird diese Nachricht nicht hervorgehoben und nur 1 Schaltfläche zum Löschen der Nachricht angezeigt. Die als gelesen zu markierende Schaltfläche wird nicht angezeigt. Wenn Sie zu „Element prüfen“ gehen, werden Sie feststellen, dass das Formular zum Markieren als gelesen überhaupt nicht erstellt wird.

Löschen Sie die Nachricht

Jetzt müssen wir im Admin-Bereich eine Datei mit dem Namen „delete-inbox-message.php“. Hier führen wir die Löschabfrage aus, mit der diese Zeile aus der Posteingangstabelle entfernt wird.

<?php
    // connect with database
    $conn = mysqli_connect("localhost:8889", "root", "root", "yourdbname");

    // prevent from SQL injection
    $id = mysqli_real_escape_string($conn, $_POST["id"]);
    
    // delete the message
    $sql = "DELETE FROM inbox WHERE id = " . $id;
    mysqli_query($conn, $sql);

    // display a success message
    echo "<p>Message has been deleted.</p>";
?>

Alle Schritte außer der Abfrage und der Nachricht sind gleich. Die Abfrage sucht nach Nachrichten anhand ihrer ID in der Tabelle „Posteingang“ und löscht sie. Die Erfolgsmeldung wird angezeigt. Wenn Sie das nächste Mal die Posteingangsseite in Ihrem Admin-Bereich öffnen, wird diese Nachricht in dieser Liste nicht mehr angezeigt. Wenn Sie jedoch Echtzeitnachrichten im Admin-Bereich anzeigen möchten, dh wenn jemand eine Nachricht über das Kontaktformular sendet, müssen Sie die Seite im Admin-Bereich nicht aktualisieren, um neue Nachrichten anzuzeigen. Alle neu eingehenden Nachrichten werden dort automatisch angezeigt. Überprüfen Sie diesen Beitrag wenn Sie diese Funktion auch haben möchten.