实现实时聊天中的链接
Implementing links in realtime chat
所以我正在与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;
将只是显示我的超链接在纯文本没有它是可点击的,有没有办法做到这一点,而不设置网站的风险?
我花了几个小时到处找,没有找到任何与此相关的东西。
提前感谢!
您应该始终清理用户输入。您需要链接,因此您必须允许在消息中使用一些html标记,但您希望过滤掉大多数标记(有些是危险的,如脚本,有些可能会"破坏"您的聊天视觉效果)。尝试使用像
这样的包https://www.npmjs.com/package/sanitize-html自己卷消毒液不是个好主意。像这样的包允许指定允许哪些标签,删除哪些标签,并有各种其他有用的选项。
相关文章:
- 创建一个类似链接的按钮,并通过Javascript函数打开一个新的弹出窗口
- 如何使用jQuery自动打开页面上的所有链接
- 动态地改变“”的URL;添加新项目”;链接使用javascript/jquery
- jquery动画可以通过编程链接吗
- 在单击href链接的同时下载文件
- 尽管链接成功并已成功下载,但未找到NPM模块
- 制作一个不带HTML a标记但在动画播放完毕后指向其他页面的超链接
- ReactJS映射:如何仅在url变量不为空时呈现html链接
- 单击页面上的链接后高度发生变化
- 将纯文本URL转换为可单击链接
- python-selenium-点击上升链接
- 一点javascript元编程&可链接的设置器
- ng视图外的链接重定向到ng视图内的页面
- 在聊天窗口中检测链接单击事件
- UI 聊天应用程序中的可单击链接
- 如何改变链接时,点击/复制像facebook Messenger聊天
- 实现实时聊天中的链接
- 逃避用户生成的聊天消息,但呈现链接
- 如何链接zopim聊天小部件与自定义表单
- Joomla3.6自定义html模块中的“与我聊天”链接