it-swarm.com.de

JavaScript Regex, um eine URL in einem Textfeld zu finden

Wie kann ich meinen Regex einrichten, um zu testen, ob eine URL in einem Textblock in Javascript enthalten ist. Ich kann nicht genau das Muster herausfinden, um dies zu erreichen

 var urlpattern = new RegExp( "(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?"

 var txtfield = $('#msg').val() /*this is a textarea*/

 if ( urlpattern.test(txtfield) ){
        //do something about it
 }

BEARBEITEN:

Das Muster, das ich jetzt habe, funktioniert in Regex-Testern für das, was ich brauche, aber Chrom wirft einen Fehler

  "Invalid regular expression: /(http|ftp|https)://[w-_]+(.[w-_]+)+([w-.,@?^=%&:/~+#]*[[email protected]?^=%&/~+#])?/: Range out of order in character class"

für den folgenden Code:

var urlexp = new RegExp( '(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?' );
22
BillPull

Obwohl die Strichzeichen (die innerhalb von Zeichenklassen eine besondere Bedeutung als Zeichenbereichsbezeichner haben können) nicht beachtet werden können, sollte sollte funktionieren. Eine andere Methode, um ihre spezielle Bedeutung zu entfernen, besteht darin, sie an den Anfang oder das Ende der Klasse zu setzen Definition. 

Außerdem werden \+ und \@ in einer Zeichenklasse tatsächlich von der JavaScript-Engine als + bzw. @ interpretiert. Die Fluchten sind jedoch nicht notwendig und können jemanden verwirren, der versucht, den Regex visuell zu interpretieren.

Ich würde folgende Regex für Ihre Zwecke empfehlen:

(http|ftp|https)://[\w-]+(\.[\w-]+)+([\w.,@?^=%&:/~+#-]*[\[email protected]?^=%&/~+#-])?

dies kann in JavaScript entweder durch Übergabe an den RegExp-Konstruktor (wie in Ihrem Beispiel) angegeben werden:

var urlPattern = new RegExp("(http|ftp|https)://[\w-]+(\.[\w-]+)+([\w.,@?^=%&:/~+#-]*[\[email protected]?^=%&/~+#-])?")

oder durch direktes Angeben eines Regex-Literal unter Verwendung der //-Anführungsart:

var urlPattern = /(http|ftp|https):\/\/[\w-]+(\.[\w-]+)+([\w.,@?^=%&:\/~+#-]*[\[email protected]?^=%&\/~+#-])?/

Der RegExp-Konstruktor ist erforderlich, wenn Sie einen Regex als Zeichenfolge akzeptieren (z. B. von einer Benutzereingabe oder einem Aufruf von AJAX) und möglicherweise lesbarer sind (wie in diesem Fall). Ich bin ziemlich sicher, dass die //-Zitiermethode effizienter ist und zu bestimmten Zeiten besser lesbar ist. Beide arbeiten.

Ich habe Ihr Original und diese Modifikation unter Verwendung von Chrome sowohl unter < JSFiddle > als auch unter < RegexLib.com > getestet. Dabei wurde die clientseitige Regex-Engine (Browser) verwendet und insbesondere JavaScript ausgewählt. Während der erste Fehler mit dem von Ihnen angegebenen Fehler fehlschlägt, ist meine vorgeschlagene Änderung erfolgreich. Wenn ich die h aus der http in der Quelle entferne, passt sie nicht, wie es sollte!

Bearbeiten

Wie von @noa in den Kommentaren erwähnt, stimmt der obige Ausdruck nicht mit lokalen Netzwerkservern (Nicht-Internet-Servern) oder anderen Servern überein, auf die mit einem einzelnen Word (z. B. http://localhost/... oder https://sharepoint-test-server/...) zugegriffen wird. Wenn eine Übereinstimmung mit dieser Art von URL gewünscht wird (was möglicherweise auch nicht der Fall ist), könnte das Folgende sinnvoller sein:

(http|ftp|https)://[\w-]+(\.[\w-]+)*([\w.,@?^=%&amp;:/~+#-]*[\[email protected]?^=%&amp;/~+#-])?

#------changed----here-------------^

<End Edit>

Schließlich ist eine ausgezeichnete Ressource, die mir 90% von dem beigebracht hat, was ich über regex weiß, Regular-Expressions.info - Ich kann es wärmstens empfehlen, wenn Sie regex lernen möchten (sowohl was es kann als auch was es nicht kann). !

64
Code Jockey

Sie müssen den Backslash entziehen, wenn Sie new RegExp verwenden. 

Sie können auch den Gedankenstrich - am Ende der Zeichenklasse setzen, um zu verhindern, dass die Zeichenklasse überschritten wird.

&amp; innerhalb einer Zeichenklasse bedeutet & or a or m or p or ;, Sie müssen lediglich & eingeben und ;, a, m and p sind bereits mit \w übereinstimmen.

So wird Ihre Regex:

var urlexp = new RegExp( '(http|ftp|https)://[\\w-]+(\\.[\\w-]+)+([\\w-.,@?^=%&:/~+#-]*[\\[email protected]?^=%&;/~+#-])?' );
4
Toto

Hier ist das vollständigste einzelne URL-Analysemuster.

Es funktioniert mit JEDER URI/URL in JEDER Unterzeichenfolge!

https://regex101.com/r/jO8bC4/5

Beispiel-JS-Code mit Ausgabe - Jede URL wird in ein 5-teiliges Array ihrer "Teile" umgewandelt:

var re = /([a-z]+\:\/+)([^\/\s]*)([a-z0-9\[email protected]\^=%&;\/~\+]*)[\?]?([^ \#]*)#?([^ \#]*)/ig; 
var str = 'Bob: Hey there, have you checked https://www.facebook.com ?\n(ignore) https://github.com/justsml?tab=activity#top (ignore this too)';
var m;

while ((m = re.exec(str)) !== null) {
    if (m.index === re.lastIndex) {
        re.lastIndex++;
    }
    console.log(m);
}

Wird dir folgendes geben:

["https://www.facebook.com",
  "https://",
  "www.facebook.com",
  "",
  "",
  ""
]

["https://github.com/justsml?tab=activity#top",
  "https://",
  "github.com",
  "/justsml",
  "tab=activity",
  "top"
]

BAM! RegEx FTW!

4
Dan Levy

probiere (http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&amp;:/~\+#]*[\w\-\@?^=%&amp;/~\+#])?

1
Vinit

Ich habe deine Regex aufgeräumt:

var urlexp = new RegExp('(http|ftp|https)://[a-z0-9\-_]+(\.[a-z0-9\-_]+)+([a-z0-9\-\.,@\?^=%&;:/~\+#]*[a-z0-9\[email protected]\?^=%&;/~\+#])?', 'i');

Getestet und funktioniert einwandfrei;)

1
matthiasmullie

versuchen Sie, das hat für mich funktioniert

/^((ftp|http[s]?):\/\/)?(www\.)([a-z0-9]+)\.[a-z]{2,5}(\.[a-z]{2})?$/

das ist so einfach und verständlich

1
Tolga İskender

Versuchen Sie diese allgemeine Regex für viele URL-Formate

/(([A-Za-z]{3,9})://)?([-;:&=\+\$,\w][email protected]{1})?(([-A-Za-z0-9]+\.)+[A-Za-z]{2,3})(:\d+)?((/[-\+~%/\.\w]+)?/?([&?][-\+=&;%@\.\w]+)?(#[\w]+)?)?/g
1

Das Problem ist, dass das "-" in der Zeichenklasse (die Klammern) als Bereich analysiert wird: [a-z] bedeutet "jedes Zeichen zwischen a und z." Wie von Vini-T vorgeschlagen, müssen Sie die "-" - Zeichen in den Zeichenklassen mit einem Backslash schützen.

0
PotatoEngineer