Erstellung eines Kontaktformulars in Laravel unter Verwendung des Laravel Collective Form Builder

Erstellung eines Kontaktformulars in Laravel unter Verwendung des Laravel Collective Form Builder

In diesem Tutorial lernst du, wie man ein voll funktionsfähiges Kontaktformular in Laravel erstellt, indem man das Laravel Collective Form Builder-Paket verwendet. Du wirst Schritt für Schritt durch den Prozess geführt, einschließlich der Validierung von Benutzereingaben und dem Versand von E-Mails an den Absender und Empfänger.

Zuerst werde ich Ihnen zeigen, wie Sie ein Kontaktformular in Laravel erstellen können. Dann werde ich Ihnen zwei Optionen geben, um das Kontaktformular zu implementieren, entweder durch Verwendung einer Laravel-Funktion oder durch Verwendung eines Laravel-Pakets.

Kontaktformular in Laravel erstellen

  1. Öffnen Sie die Befehlszeile und navigieren Sie zum Root-Verzeichnis Ihres Laravel-Projekts.
  2. Führen Sie den Befehl php artisan make:controller ContactController aus, um einen neuen Controller zu erstellen.
  3. Öffnen Sie den neu erstellten Controller im Verzeichnis app/Http/Controllers/ und fügen Sie die folgenden Funktionen hinzu:
    public function create()
    {
        return view('contact');
    }
    
    public function store(Request $request)
    {
        $request->validate([
            'name' => 'required',
            'email' => 'required|email',
            'message' => 'required',
        ]);
    
        Mail::to('your@email.com')->send(new ContactMail($request));
    
        return back()->with('success', 'Vielen Dank für Ihre Nachricht!');
    }
    
  4. Führen Sie den Befehl php artisan make:mail ContactMail aus, um eine neue E-Mail-Klasse zu erstellen.
  5. Öffnen Sie die neu erstellte E-Mail-Klasse im Verzeichnis app/Mail/ und fügen Sie die folgenden Funktionen hinzu:
    public function __construct($request)
    {
        $this->request = $request;
    }
    
    public function build()
    {
        return $this->from($this->request->email)
            ->subject('Kontaktformular-Nachricht')
            ->view('emails.contact')
            ->with([
                'name' => $this->request->name,
                'email' => $this->request->email,
                'message' => $this->request->message,
            ]);
    }
    
  6. Erstellen Sie eine neue Blade-Datei namens contact.blade.php im Verzeichnis resources/views/emails/ und fügen Sie den folgenden Code hinzu:
    <p>Name: {{ $name }}</p>
    <p>Email: {{ $email }}</p>
    <p>Message: {{ $message }}</p>
    
  7. Erstellen Sie eine neue Blade-Datei namens contact.blade.php im Verzeichnis resources/views/ und fügen Sie den folgenden Code hinzu:
    @if (session('success'))
        <div class="alert alert-success">
            {{ session('success') }}
        </div>
    @endif
    
    <form action="{{ route('contact.store') }}" method="POST">
        @csrf
    
        <div class="form-group">
            <label for="name">Name</label>
            <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" value="{{ old('name') }}" required>
            @error('name')
                <span class="invalid-feedback">{{ $message }}</span>
            @enderror
        </div>
    
        <div class="form-group">
            <label for="email">E-Mail-Adresse</label>
            <input type="email" name="email" class="form-control @error('email') is-invalid @enderror" value="{{ old('email') }}" required>
            @error('email')
                <span class="invalid-feedback">{{ $message }}</span>
            @enderror
        </div>
    
        <div class="form-group">
            <label for="message">Nachricht</label>
            <textarea name="message" class="form-control @error('message') is-invalid @enderror" rows="5" required>{{ old('message') }}</textarea>
            @error('message')
                <span class="invalid-feedback">{{ $message }}</span>
            @enderror
        </div>
    
        <button type="submit" class="btn btn-primary">Absenden</button>
    </form>
    

Nachdem Sie das Kontaktformular in Laravel erstellt haben, gibt es zwei Optionen, um es zu implementieren: entweder durch Verwendung einer Laravel-Funktion oder durch Verwendung eines Laravel-Pakets.

Option 1: Laravel-Funktion

In Laravel können Sie ganz einfach ein Kontaktformular mit der Mail -Funktion senden. Dazu müssen Sie die erforderlichen Felder im Controller überprüfen und dann die Mail -Funktion verwenden, um die E-Mail-Nachricht zu senden. Die Mail -Funktion verwendet SMTP-Einstellungen aus der Laravel-Konfigurationsdatei .env.

Hier ist der Code für die Funktion, die Sie in Ihrem Controller verwenden können:

public function sendContactForm(Request $request)
{
    $request->validate([
        'name' => 'required',
        'email' => 'required|email',
        'message' => 'required',
    ]);

    $data = [
        'name' => $request->name,
        'email' => $request->email,
        'message' => $request->message,
    ];

    Mail::send('emails.contact', $data, function($message) {
        $message->to('empfaenger@beispiel.de', 'Empfänger Name')->subject('Kontaktformular');
    });

    return back()->with('success', 'Vielen Dank für Ihre Nachricht!');
}

Diese Funktion validiert die Eingabe des Benutzers, setzt dann die Daten in ein Array und verwendet die "Mail" -Funktion, um eine E-Mail-Nachricht zu senden.

Option 2: Laravel-Paket

Es gibt viele Laravel-Pakete, die Ihnen dabei helfen können, ein Kontaktformular in Ihrem Laravel-Projekt zu implementieren. Eines der besten Pakete ist Laravel Collective Forms.

Hier ist der Code, um das Kontaktformular mit dem Laravel Collective Forms-Paket zu implementieren:

  1. Fügen Sie die folgende Zeile zu Ihrer composer.json-Datei hinzu:
    "laravelcollective/html": "^6.0"
    
  2. Führen Sie den Befehl composer update aus, um das Paket zu installieren.
  3. Öffnen Sie Ihre config/app.php -Datei und fügen Sie die folgende Zeile zur providers -Liste hinzu:
    Collective\Html\HtmlServiceProvider::class,
    
  4. Fügen Sie die folgende Zeile zur aliases -Liste in derselben Datei hinzu:
    'Form' => Collective\Html\FormFacade::class,
    
  5. Öffnen Sie Ihre contact.blade.php -Datei und fügen Sie den folgenden Code hinzu:
    {!! Form::open(['route' => 'contact.store']) !!}
    
        <div class="form-group">
            {!! Form::label('name', 'Name') !!}
            {!! Form::text('name', null, ['class' => 'form-control']) !!}
        </div>
    
        <div class="form-group">
            {!! Form::label('email', 'E-Mail-Adresse') !!}
            {!! Form::email('email', null, ['class' => 'form-control']) !!}
        </div>
    
        <div class="form-group">
            {!! Form::label('message', 'Nachricht') !!}
            {!! Form::textarea('message', null, ['class' => 'form-control']) !!}
        </div>
    
        {!! Form::submit('Absenden', ['class' => 'btn btn-primary']) !!}
    
    {!! Form::close() !!}
    
  6. Erstellen Sie eine neue Route in Ihrer web.php -Datei, um die Daten zu verarbeiten und die E-Mail-Nachricht zu senden:
    Route::post('/contact', function(Request $request) {
    
        $request->validate([
            'name' => 'required',
            'email' => 'required|email',
            'message' => 'required',
        ]);
    
        $data = [
            'name' => $request->name,
            'email' => $request->email,
            'message' => $request->message,
        ];
    
        Mail::send('emails.contact', $data, function($message) {
            $message->to('empfaenger@beispiel.de', 'Empfänger Name')->subject('Kontaktformular');
        });
    
        return back()->with('success', 'Vielen Dank für Ihre Nachricht!');
    
    })->name('contact.store');
    

Diese Route validiert die Benutzereingabe, setzt dann die Daten in ein Array und verwendet die Mail -Funktion, um eine E-Mail-Nachricht zu senden. Wenn die Nachricht erfolgreich gesendet wurde, wird der Benutzer zur vorherigen Seite zurückgeleitet und eine Erfolgsmeldung angezeigt.

Das Laravel Collective Forms -Paket erleichtert die Erstellung von Formularen erheblich und bietet viele nützliche Funktionen. Mit diesem Paket können Sie schnell und einfach ein Kontaktformular in Laravel implementieren.

Um das Kontaktformular erfolgreich zu implementieren, müssen Sie sicherstellen, dass Ihre Mail -Klasse in Laravel richtig konfiguriert ist. Dazu müssen Sie Ihre SMTP-Einstellungen in der .env -Datei in Ihrem Laravel-Projekt einrichten.

Hier ist ein Beispiel für SMTP-Einstellungen, die Sie in Ihrer .env -Datei einrichten können:

MAIL_DRIVER=smtp
MAIL_HOST=smtp.example.com
MAIL_PORT=587
MAIL_USERNAME=username@example.com
MAIL_PASSWORD=your_password
MAIL_ENCRYPTION=tls
MAIL_FROM_ADDRESS=noreply@example.com
MAIL_FROM_NAME=Example Company

Stellen Sie sicher, dass Sie Ihre SMTP-Einstellungen mit den Details Ihres SMTP-Servers aktualisieren. Sobald Sie diese Einstellungen aktualisiert haben, können Sie das Kontaktformular in Laravel erfolgreich implementieren.

Insgesamt gibt es viele Möglichkeiten, um ein Kontaktformular in Laravel zu implementieren. Die oben genannten Optionen sind nur einige der besten Methoden, die von erfahrenen Laravel-Entwicklern empfohlen werden.

Google reCAPTCHA

Eine Sache, die Sie auch berücksichtigen sollten, ist die Verwendung von Captchas auf Ihrem Kontaktformular, um sicherzustellen, dass es von einem menschlichen Benutzer ausgefüllt wird und nicht von einem Bot.

Das Google reCAPTCHA -Paket ist eine großartige Option für die Implementierung von Captchas in Laravel. Hier ist ein Beispiel für die Verwendung von Google reCAPTCHA in einem Kontaktformular mit dem Laravel Collective Forms-Paket:

  1. Installieren Sie das Google reCAPTCHA -Paket über Composer:
    composer require greggilbert/recaptcha
    
  2. Konfigurieren Sie das Paket, indem Sie den folgenden Code in der config/app.php -Datei hinzufügen:
    'providers' => [
        // ...
        Greggilbert\Recaptcha\RecaptchaServiceProvider::class,
    ],
    
    'aliases' => [
        // ...
        'Recaptcha' => Greggilbert\Recaptcha\Facades\Recaptcha::class,
    ],
    
  3. Erstellen Sie ein neues Captcha-Schlüsselpaar von der Google reCAPTCHA-Website: https://www.google.com/recaptcha/admin/create
  4. Fügen Sie das Captcha in Ihrem Kontaktformular ein, indem Sie den folgenden Code hinzufügen:
    {!! Form::open(['route' => 'contact.store']) !!}
        {!! Form::label('name', 'Name') !!}
        {!! Form::text('name') !!}
    
        {!! Form::label('email', 'E-Mail-Adresse') !!}
        {!! Form::email('email') !!}
    
        {!! Form::label('message', 'Nachricht') !!}
        {!! Form::textarea('message') !!}
    
        {!! Recaptcha::render() !!}
    
        {!! Form::submit('Senden') !!}
    {!! Form::close() !!}
    
  5. Aktualisieren Sie Ihre Route, um das Captcha zu validieren:
    Route::post('/contact', function(Request $request) {
    
        $request->validate([
            'name' => 'required',
            'email' => 'required|email',
            'message' => 'required',
            'g-recaptcha-response' => 'required|recaptcha',
        ]);
    
        // ...
    });
    
    
  6. Stellen Sie sicher, dass Ihre Mail -Klasse in Laravel korrekt konfiguriert ist, wie im vorherigen Beispiel erklärt.

Mit der oben genannten Methode können Sie ein Kontaktformular in Laravel mit Google reCAPTCHA implementieren, um sicherzustellen, dass das Formular von einem menschlichen Benutzer ausgefüllt wird.

Ich hoffe, dieses Tutorial war hilfreich und hat Ihnen gezeigt, wie einfach es ist, ein Kontaktformular in Laravel zu erstellen und es mithilfe des Laravel Collective Form Builder -Pakets zu verwalten. Ich wünsche Ihnen viel Erfolg bei der Integration des Kontaktformulars in Ihre Laravel-Anwendung!


Laravel Bootstrap Components

NEW Laravel Bootstrap Components absofort verfügbar

Laravel Bootstrap Components ist ein Starter-Kit für Laravel mit Blade und Bootstrap speziell entwickelt für Entwickler.

META
Kategorie:
Laravel
Autor:
Markus Zundel
Datum:
15.02.2023
Impressum

© 2024 Zundel-Webdesign - Alle Rechte vorbehalten.
Die als Artikel veröffentlichten Inhalte unterliegen dieser Creative Commons Licence.