URL-Validierung oder: Wie ich gelernt habe, mir keine Sorgen mehr zu machen und den Benutzer zu lieben

Für jeden Webentwickler kommt der Zeitpunkt, an dem er irgendeine Art von Eingabevalidierung durchführen muss. Ein Formular ist kein Blog-Beitrag, in dem ein Benutzer in einem E-Mail-Feld poetisch über seine Liebe zu Yahoo Mail schwärmen kann. Schließlich muss es Grenzwerte für die Wortanzahl, Prüfungen auf bestimmte Zeichen und einfache Validierungstechniken geben, die den Benutzer davon abhalten, eine Junk-POST-Anfrage zu senden.

Was aber, wenn Sie eine URL validieren müssen? Und um dem Problem noch eine weitere Ebene hinzuzufügen: Was wäre, wenn Sie nur den Hostnamen einer URL, keine Pfade, kein Protokoll, nur den „dubya dubya dubya dot“ (www.) und die .com.

benötigen

Beginnen wir damit, herauszufinden, ob eine URL eine URL ist. Für einen Link sind eine zweite und oberste Domäne (Walmart bzw. .com in walmart.com) und ein Schema (https://) erforderlich. Ohne diese Teile verlinkt der Link zu nichts und unterscheidet sich nicht von einer Textzeile.

Aber jetzt, da wir die Teile einer URL kennen, erreichen wir eine Abzweigung oder einen Entwicklungspfad. Sollte die Validierung den Benutzer am Feld einschränken oder die Benutzereingabe bereinigen, wenn die Daten an den Server gesendet werden?

Es gibt Vorzüge und Mängel bei beiden Optionen:

---

Validierung vor der Einreichung

Wenn Sie den Benutzer daran hindern, eine ungültige URL einzureichen, können Sie die Daten einfach und ohne zusätzlichen Aufwand auf der Serverseite übernehmen, indem Sie den Benutzer dazu zwingen, genau die Eingabestruktur einzureichen, die Sie benötigen. In diesem Fall würde das Musterattribut für das Eingabeelement in Kombination mit etwas Regex eine gute altmodische Feldvalidierung ermöglichen.

Hier ist ein Beispiel für diesen Ansatz:

<input type="text" pattern="https?://.*"

Die Einschränkung des Benutzers hat jedoch auch den Nachteil. Es erfordert, dass der Benutzer bestimmte Teile seiner Eingabe hat, und wenn nur eine .com-Datei vorhanden sein muss, ist das lange Regex-Muster möglicherweise übertrieben.

---

Validierung nach Einreichung

Wenn Sie sich andererseits dafür entscheiden, die Daten zu bereinigen, nachdem der Benutzer sie übermittelt hat, kann der Benutzer alles eingeben und der Server kann entscheiden, was mit den Daten geschehen soll. Der URL-Konstruktor von Javascript übernimmt die Validierung für Sie, gibt einen TypeError zurück, wenn die Eingabe ungültig ist, und ermöglicht Ihnen außerdem, bestimmte Teile der URL wie den Ursprung oder den Hostnamen zu extrahieren.

Hier ist ein Beispiel für diesen Ansatz:

export const formatWebsiteAfterDomain = (website: string): string => {
  if (!website.trim().length) {
    return '';
  }
  const regEx = /:\/\//;
  const websiteTrimmed = website.trim();
  const hasProtocol = regEx.exec(websiteTrimmed);
  const updatedWebsite = hasProtocol
    ? websiteTrimmed
    : `https://${websiteTrimmed}`;

  try {
    const url = new URL(updatedWebsite);
    return hasProtocol ? url.origin : url.origin.replace('https://', '');
  } catch (_err) {
    return websiteTrimmed;
  }
};

Da Sie dem Benutzer jedoch so viel Freiheit bei der Eingabe geben, sind einige Kompromisse bei der Verarbeitung der Daten durch den Server erforderlich. Was machen Sie damit, wenn der Benutzer eine ungültige URL eingibt? Verwenden Sie die TypeError-Antwort und benachrichtigen Sie den Benutzer oder erlauben Sie dem Server einfach, das zu konsumieren, was der Benutzer gesendet hat? Darüber hinaus validiert der URL-Konstruktor die Eingabe, indem er prüft, ob ein Schema vorhanden ist (https:// oder http://), was für Ihre Verwendung möglicherweise zu wenig Validierung darstellt.

---

Letztendlich hängt der eingeschlagene Weg von den spezifischen Randfällen Ihres Problems ab. Eine Kombination beider Lösungen könnte die umfassendste und vielseitigste sein, oder eine der Optionen könnte gerade ausreichend sein. Der Benutzer kann beliebige Eingaben machen und Ihre Lösung wird davon abhängen, wie viel Freiheit Sie dem Benutzer geben möchten. Was jedoch universell bleibt, ist, dass die Fähigkeit des Benutzers, alles einzugeben, Benutzer und Entwickler immer dazu zwingt, einen Kompromiss einzugehen (oft erhält der Entwickler ein bestimmtes Eingabemuster und der Benutzer darf seine Anwendung verwenden).

Aber da die Besonderheiten von Benutzereingaben ewig bestehen, wird es immer Entwickler geben, die hektisch Lösungen herausbringen, damit ihre Web-Apps nicht kaputt gehen, wenn Benutzer versuchen, Bilder in das URL-Feld eines Formulars einzufügen.

Das obige ist der detaillierte Inhalt vonURL-Validierung oder: Wie ich gelernt habe, mir keine Sorgen mehr zu machen und den Benutzer zu lieben. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!