CODEWITHSUNDEEP
javascriptregex
Avatar
Avatar

Reputation: 15186

Regex to find png-gif-jpg image links in HTML of CKeditor

I am using the following regex to intercept posted image links in CKeditor: 

var editorContent = String(qa_ckeditor_content.getData());
if( editorContent.match(/(https?:\/\/\S+\.(?:jpg|png|gif|jpg<br|png<br|gif<br|jpg<\/p>|png<\/p>|gif<\/p>))\s+/) != null ) {
    alert('Sorry, image links not allowed.');
    return false;
}

However, this will not find something like: 

<a href="#">myimage.png</a>

I am trying to find the regex the looks for png<... (plus following characters). I tried that using a dot which seems not correct:

/(https?:\/\/\S+\.(?:jpg|png|gif|jpg<.|png<.|gif<.))\s+/

I know that this is a beginner question, but I failed finding the right solution :-(

Thank you for your time!

Upvotes: 0

Views: 6647

Answers (2)

melwil
melwil

Reputation: 2553

First of all, I would like to point out the false security of blacklisting. There will always be that other case you didn't think of that makes it through.

That being said; you could just have the the regex search for .jpg, .png, .gif etc. followed by anything other than a word character.

/\.(jpg|png|gif)\b/

This will match those extensions in any case I can think of at least, and can replace that entire regex you have so far.

Upvotes: 2

Ria
Ria

Reputation: 10347

Try this regex:

<a[^>]+>(.+?\.(?:jpg|png|gif))<

and a sample code:

match = inputString.match(/<a[^>]+>(.+?\.(?:jpg|png|gif))</);
if (match != null) {
    // matched text: match[0]
    file = match[1];
} else {
    // Match attempt failed
}

Upvotes: 0

Related Questions