PSMailer – Die pechschwarz Mailer-API

Dies ist ein Node-Modul, welches es mit wenig Konfigurations-Aufwand ermöglicht, Daten an die Mailer-API (https://mailer.pechschwarz.io) zu senden.

Die Mailer-API ermöglicht es E-Mails über einen SMTP-Server zu senden.

Abhängigkeiten

Aktuell gibt es keine Abhängigkeiten. Grundsätzlich wird Serverseitig PHPMailer für den Versand der E-Mails verwendet. Die definierten SMTP-Daten werden durch das Modul vorgegeben.

Installation

Das Modul wird über npm installiert:

npm install psmailer

Nun müssen die Funktionen und Klassen noch importiert werden:

import { PSMailer, getFiles, getText } from "psmailer"

Klasse

Die PSMailer-Klasse beinhaltet die Hauptfunktionalität. In einer Applikation sollte die Klasse im besten Falle nur einmal erzeugt werden und in den verschiedene Komponenten, welche die Klasse nutzen, importiert werden.

const mailer = new PSMailer(options);

Optionen

Folgende Optionen stehen zur Verfügung:

| Name | Typ | Beschreibung | Standard | |:---- | --- | ------ | ------ | token (Pflichtfeld) | string | Den Token zu Authentifizierung. | null smtp | object | Beinhaltet die Daten des SMTP-Servers. Erwartet folgende Werte: host, username, password, secure, port. Grundsätzlich kann sich hier an den Eingstellungen von PHPMailer orientiert werden. | Standard SMTP-Server from | string | Die angezeigte Absende-Adresse. | [email protected] logo (Pflichtfeld) | string | Das base64 kondierte Logo (für den Header). | base64 Logo (pechschwarz) color (Pflichtfeld) | string | Die Hex-Farbe der E-Mail. | "#171b1c" link (Pflichtfeld) | string | Der Link zur Website. | "#" imprint (Pflichtfeld) | string | Der Link zum Impressum. | "#" privacy (Pflichtfeld) | string | Der Link zur Datenschutzerklärung. | "#" address (Pflichtfeld) | string | Die Adresse für den Footer. | "pechschwarz<br />Max-Planck-Straße 19<br />42277 Wuppertal"

Die Optionen werden als Objekt übergeben.

Methoden

const status = await mailer.sendMail(data);

Die Funktion sendet eine Mail ab. Es wird ein Array mit Status-Informationen zurückgegeben.

Daten

Die Methode erwartet folgende Daten:

| Name | Typ | Beschreibung | Verpflichtend | |:---- | --- | ------ | ------ | subject | string | Der Betreff der E-Mail. | Ja headline | string | Die Überschrift der E-Mail. | Ja text | string | Der Text der E-Mail. | Ja button | object | Der Button der E-Mail. Erwartet folgende Werte: title, link. | Nein mail | [string] | Die Empfänger-Adressen. | Ja files | [FileList] | Die Anhänge der E-Mail. | Nein

Die Daten werden als Objekt übergeben.

Funktionen

getFiles(formData)

Die Funktion hilft dabei Datein aus input-Feldern zu extrahieren.

const files = getFiles(formData) : [FileList]

Der Parameter formData beschreibt die Formular-Felder. Diese können in der Regel über das Event gezogen werden:

function submitForm(event) {
    event.preventDefault();

    const files = getFiles(event.target.elements);
}

Die Funktion liefert ein Array bestehend aus FileList zurück.

getText(formData)

Die Funktion generiert automatisch einen Formular-Text aus den Formular-Feldern (ausgenommen sind File-Inputs). Dabei dient der name als Key und das value als Wert.

const text = getText(formData) : string

Der Parameter formData beschreibt die Formular-Felder. Diese können in der Regel über das Event gezogen werden:

function submitForm(event) {
    event.preventDefault();

    const text = getText(event.target.elements);
}

Die Funktion gibt einen String zurück.

Beispiel

Dieses Beispiel nutzt alle zur Verfügung stehende Funktionen.

"use client"

import { PSMailer, getFiles, getText } from "psmailer"

export defaut function Form(props) {
    const mailer = new PSMailer({
        token: "mytoken",
        color: "#00FFD4",
        link: "https://www.pechschwarzmedia.de/",
        imprint: "https://www.pechschwarzmedia.de/impressum/",
        privacy: "https://www.pechschwarzmedia.de/datenschutz/",
        address: "pechschwarz<br />Max-Planck-Straße 19<br />42277 Wuppertal"
    });

    async function submitForm(event) {
        event.preventDefault();

        const files = getFiles(event.target.elements);
        const text = getText(event.target.elements);

        const status = await mailer.sendMail({
            subject: "Betreff",
            headline: "Überschrift",
            text: text,
            button: {
                title: "Klick mich!",
                link: "#"
            },
            mail: ["[email protected]"],
            files: files
        });

        console.log(status);
    }

    return (
        <form onSubmit={(event) => {submitForm(event)}} method="POST">
            <select name="Geschlecht">
                <option value="Herr">Herr</option>
                <option value="Frau">Frau</option>
                <option value="Divers">Divers</option>
            </select>
            <input type="text" name="Vorname" placeholder="Vorname*" required />
            <input type="text" name="Nachname" placeholder="Nachname*" required />
            <input type="text" name="Adresse" placeholder="Adresse" />
            <input type="file" multiple />
            <input type="file" />
            <button type="submit">Absenden</button>
        </form>
    )
}