0

这是我运行代码时得到的输出:

[19:01:06] User: <a href="http://www.google.com" target="_blank" >http://www.google.com </a>

它不会创建仅显示 a href 标记的链接。

这就是链接的原因:

function linkify(inputText) {
var replacedText, replacePattern1, replacePattern2, replacePattern3;

//URLs starting with http://, https://, or ftp://
replacePattern1 = /(\b(https?|ftp):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/gim;
replacedText = inputText.replace(replacePattern1, '<a href="$1" target="_blank">$1</a>');

//URLs starting with "www." (without // before it, or it'd re-link the ones done above).
replacePattern2 = /(^|[^\/])(www\.[\S]+(\b|$))/gim;
replacedText = replacedText.replace(replacePattern2, '$1<a href="http://$2" target="_blank">$2</a>');

return replacedText;

}

因此,在教程聊天框中,我将文本发送到了 firebase 列表,例如:

text=linkify(text);
    myDataRef.push({timestamp: timestamp, name: name, text: text, emote: emote});

这是显示部分的样子:

function displayChatMessage(timestamp, name, text, emote) {

        $('<div/>').text('['+timestamp+'] ').append($('<name/>').text(name+': ')).append($('<em/>').text(text)).appendTo($('#messagesDiv'));
}
$('#messagesDiv')[0].scrollTop = $('#messagesDiv')[0].scrollHeight;

};

我曾尝试插入其他 html 标签,但这也不起作用。整个代码只是基于教程聊天并从那里开始工作。

4

1 回答 1

0

jQuery 的 .text() 对 HTML 进行转义,使其显示为文本而不是呈现为 HTML。聊天示例有意使用它,以避免HTML Script Injection。您可以通过将渲染代码更改为:

$('<div/>').text('['+timestamp+'] ').append($('<name/>').text(name+': ')).append($('<em/>').html(text)).appendTo($('#messagesDiv'));

请注意使用 .html(text) 而不是 .text(text)。 但这并不安全。 现在,任何使用聊天的人都可以输入消息<script src="http://mysite.com/my-malicious-javascript.js"></script>作为聊天消息,其他人都将运行该 javascript。

也许这个 jQuery 插件可能是一个更好的解决方案:https ://github.com/uudashr/jquery-linkify (即以一种可能安全的方式在接收端进行链接(尽管我没有查看代码)。

于 2013-07-16T17:49:38.983 回答