[解決済み] JavaScriptでテキスト中のURLを検出する

質問

文字列のセットからURLを検出するための方法をご存知の方はいらっしゃいますか？

arrayOfStrings.forEach(function(string){
  // detect URLs in strings and do something swell,
  // like creating elements with links.
});

更新しました。 この正規表現をリンク検出に使うことになったのは、数年後のことだったようです。

kLINK_DETECTION_REGEX = /(([a-z]+:\/\/)?(([a-z0-9\-]+\.)+([a-z]{2}|aero|arpa|biz|com|coop|edu|gov|info|int|jobs|mil|museum|name|nato|net|org|pro|travel|local|internal))(:[0-9]{1,5})?(\/[a-z0-9_\-\.~]+)*(\/([a-z0-9_\-\.]*)(\?[a-z0-9+_\-\.%=&]*)?)?(#[a-zA-Z0-9!$&'()*+.=-_~:@/?]*)?)(\s+|$)/gi

完全なヘルパー (オプションでハンドルバーをサポート) は次のとおりです。 ギスト #1654670 .

解決方法は？

まず、urlにマッチする良い正規表現が必要です。これは難しいです。以下を参照してください。 ここで , こちら そして こちら :

...ほとんど何でも有効なURLになります。 そこには には、いくつかの句読点規則があります。 を分割してください。 何もない場合 句読点があっても、有効な のURLになります。

RFCをよく確認し は、無効なURLを構築することができます。 この のルールは非常に柔軟です。

例えば ::::: は有効なURLです。 パスは ":::::" . かなり のようなバカなファイル名ですが、有効なファイル名です。

また ///// は有効なURLです。 その netloc ("ホスト名")は "" . パス は "///" . またまた、バカなことを。 また を有効にしてください。 このURLは次のように正規化されます。 "///" というのが相当します。

次のようなものです。 "bad://///worse/////" は完全に有効です。 間抜けですが、有効です。

とにかく、この回答は最適な正規表現を与えるためのものではなく、JavaScriptで、テキスト内の文字列の折り返しを行う方法を証明するものなのです。

よし、じゃあこれを使ってみよう。 /(https?:\/\/[^\s]+)/g

もう一度 これは不正な正規表現です . 誤検出が多くなります。しかし、この例では十分です。

function urlify(text) {
  var urlRegex = /(https?:\/\/[^\s]+)/g;
  return text.replace(urlRegex, function(url) {
    return '<a href="' + url + '">' + url + '</a>';
  })
  // or alternatively
  // return text.replace(urlRegex, '<a href="$1">$1</a>')
}

var text = 'Find me at http://www.example.com and also at http://stackoverflow.com';
var html = urlify(text);

console.log(html)

// html now looks like:
// "Find me at <a href="http://www.example.com">http://www.example.com</a> and also at <a href="http://stackoverflow.com">http://stackoverflow.com</a>"

というわけで、まとめてやってみましょう。

$$('#pad dl dd').each(function(element) {
    element.innerHTML = urlify(element.innerHTML);
});