Окружить все экземпляры @________, #___________ и http://_________ тегами привязки?

Question

Связанные (но немного другие):

Javascript Regex: окружить @_____, #_____ и http://______ тегами привязки за один проход?

Я бы хотел окружить все экземпляры @_______, #________ и http://________ тегами привязки. Несколько проходов в порядке со мной.

Например, рассмотрим это сообщение в Твиттере:

The quick brown fox @Spreadthemovie jumps over the lazy dog #cow, http://bit.ly/bC9Dy

Запуск его с нужным шаблоном регулярных выражений даст:

The quick brown fox <a href="blah/Spreadthemovie">@Spreadthemovie</a> jumps over the lazy
dog <a href="blah/cow">#cow</a>, <a href="blah/http://bit.ly/bC9Dy">http://bit.ly/bC9Dy</a>

Только окружающие слова, начинающиеся с @, # или http: //, чтобы dog@gmail.com не стал dog@gmail.com. Также обратите внимание, как «#cow,» превратился в «<a href=urlB>#cow</a>,» ... Я хочу, чтобы только буквенно-цифровые символы были в конце каждой подстроки с тегом привязки. Также обратите внимание на атрибут href.

Если возможно, пожалуйста, включите фактический код JavaScript с шаблоном регулярных выражений и замените функцию.

Большое спасибо! Эта проблема мучает меня некоторое время

Answer 1

В моем коде у меня есть похожая функция, вы можете посмотреть и изменить ее в соответствии со своими потребностями:

function checkChatUrl($matches)
{
    if(strpos($matches[0],'http://www.xxx.pl/?task=forum')!==false) $n='>forum';
    elseif(strpos($matches[0],'http://www.xxx.pl')!==false) $n='>xxx';
    elseif(strpos($matches[0],'db.php')!==false) return "";
    elseif(strpos($matches[0],'%22')!==false) return "";
    else $n=">".substr($matches[1].$matches[2],0,10).((strlen($matches[1].$matches[2])>10)?'..':'');
    return "<a href='http://$matches[1]$matches[2]' target=_blank $n</a>";
}

$text=preg_replace_callback("/\bhttp:\/\/([\w\.]+)([\#\,\/\~\?\&\=\;\-\w+\.\/]+)\b/i",'checkChatUrl',$text);

Это было разработано для URL-ссылок в чате, оно сокращает название и для некоторых URL использует готовые ярлыки.

Answer 2

str.replace(
    /(\s|^)([#@])([\w\d]+)|(http:\/\/\S+)/g,
    '$1<a href="$3$4">$2$3$4</a>'
);

Answer 3

Одна важная вещь!

Убедитесь, что вы осведомлены о возможных рисках при наивной замене ссылок .

Не разрешайте пользователям вставлять произвольный HTML на ваш сайт. Название игры XSS дезинфицирует ввод пользователя. Если вы придерживаетесь подхода, основанного на белом списке - разрешите только те данные, которые, как вам известно, будут хорошими, и сразу же откажитесь от всего остального - тогда вы, как правило, успешно решаете любые проблемы с XSS, которые могут у вас возникнуть.

Наивная замена считается включением произвольного HTML на вашем сайте.

По крайней мере, попытайтесь убедиться, что результирующий <a href=''> не начинается с javascipt:, так как вы были бы открыты для Подделок межсайтовых запросов .

Answer 4

Вот пересмотренный ответ, основанный на пересмотренном вопросе. Вы должны поставить ревизию / комментарий на оригинальный вопрос.

Использует 3 шаблона для 3 действий и объединяет их в цепочки. Он использует шаблон границы слова (\ b \ B) вместо (^ | \ s). Это выбирает шаблоны, разделенные пунктуацией и без пробела, например, @ tweet, # tag

<script type=text/javascript>
function addTags(str) {
    return str.replace(/\B(@)(\w+)/g, '<a href"//twitter.com=/$2">$1$2</a>')
              .replace(/\B(#)(\w+)/g, '<a href="web#q=$2">$1$2</a>')
              .replace(/\b(http:\S+[^,.])/g, '<a href="$1">$1</a>')
              ;
}
function testTags() {
    document.getElementById('outstr').innerHTML =
    document.getElementById('outtxt').innerHTML =
        addTags(document.getElementById('instr').value);
}
</script>
<input type=text size=100 id="instr" value="@begin ignore@email.com and then #cow to http://mysite.com and also http://yoursite.com."><br>
<p><textarea id="outtxt" cols=90></textarea>
<p id=outstr></p>
<p><button onclick="testTags();">TEST</button>

Я проверил это выше.

Answer 5

Для сопоставления тегов @ и # я бы предложил использовать метаттерн \ w (соответствует символам слова - чтобы он совпадал с цифрами и буквами, но не с пробелами / пунктуацией). Таким образом, вы хотите, чтобы что-то вроде следующих шаблонов вытащило соответствующие элементы:

(@\w+)
(#\w+)

Для сопоставления URL-адресов простой, но наивный шаблон будет состоять в том, чтобы просто соответствовать http: //, за которым следует любой непробельный пробел:

(http://\S+)

Однако в URL-адресах есть недопустимые символы, которые могут быть захвачены этим. Более сложный шаблон, который допускает только символы, допустимые в URL, будет следующим:

(http://[a-zA-Z0-9+$_.+!*'(),#/-]+)