在实时聊天中实现链接

Question

所以我正在与 socket.io 和 node.js 进行实时聊天，并且聊天和一切正常，但如果有人在聊天中链接了一个网站，我希望它是自动超链接。

我正在使用 autolinker.js 来执行此操作，它正在按照我的意愿创建链接，但我的问题是我输出消息以避免 HTML 注入的方式。

for(var x = data.length - 1; x >= 0; x--) {
    var autolinker = new Autolinker();
    var linkedText = autolinker.link(data[x].message);
    var message = document.createElement('div');
    var linkOfMessage;
    message.setAttribute('class', 'chat-message');
    //message.textContent = data[x].name + ': ';

    message.innerHTML = data[x].name + ': ' + linkedText;

    // Append
    messages.insertBefore(message, messages.firstChild);
    messages.appendChild(message);
    messages.scrollTop = messages.scrollHeight;
    }

所以消息得到了正确处理，但是使用 innerHTML，他们基本上可以在我的聊天中使用脚本，这很糟糕。但是

message.textContent = data[x].name + ': ' + linkedText;

只会以纯文本形式显示我的超链接而无法点击，是否可以这样做而不会使网站处于危险之中？

我花了几个小时环顾四周，找不到任何与此相关的东西。

提前致谢！

Answer 1

您应该始终清理用户输入。您需要链接，所以您必须在消息中允许一些 html 标签，但您想过滤掉其中的大部分（有些是危险的，例如脚本，有些可能 "damage" 您的聊天视觉效果）。尝试使用

等软件包进行试验

https://www.npmjs.com/package/sanitize-html

自己滚消毒剂不是个好主意。像这样的包允许指定允许哪些标签，删除哪些标签并具有其他各种有用的选项。

在实时聊天中实现链接

Implementing links in realtime chat

html

javascript

node.js

socket.io