如何对Socket.io进行安全防护以抵御XSS攻击？

核心解决方案：复用现有httpOnly Cookie认证，完全避免前端暴露令牌 #

你当前已经使用了httpOnly Cookie作为REST项目的认证凭证，这个特性刚好可以解决Socket.io的令牌暴露问题：httpOnly Cookie无法被前端JS读写，就算页面发生XSS攻击，攻击者也无法获取到Cookie中的认证令牌。
Socket.io默认发起WebSocket连接（以及降级的HTTP轮询请求）时，会自动携带当前域名下的所有Cookie，你完全不需要手动把令牌写入auth配置项，前端连接代码可以简化为：

// 同域场景直接初始化即可，会自动带httpOnly认证Cookie
const socket = io();

如果是跨域部署的场景，只需要额外开启withCredentials配置即可，不需要传入任何认证令牌：

// 跨域场景配置
const socket = io("https://你的后端服务域名", {
  withCredentials: true
});

注意：跨域场景下服务端需要配置允许Credentials，且必须明确指定允许的跨域来源，不能将Access-Control-Allow-Origin设置为*，否则会触发浏览器的跨域限制。
服务端的身份校验逻辑可以直接复用现有REST接口的Cookie校验逻辑，不需要额外开发适配。

额外安全加固建议 #

• 所有聊天内容在前端渲染前必须做HTML转义，避免恶意用户发送带脚本的内容触发其他用户侧的XSS，从根源降低XSS发生概率
• 永远不要将认证令牌放入Socket.io的auth配置、自定义请求头、URL查询参数中，这些位置的内容都可以被JS读取，一旦发生XSS就会被攻击者窃取
• 可以额外添加短时效CSRF令牌校验：服务端渲染页面时将CSRF令牌写入页面Meta标签，前端连接时将其放入auth配置，该令牌仅用于防CSRF攻击，就算被XSS窃取，没有httpOnly认证Cookie也无法使用，风险极低，示例代码如下：

const socket = io({
  auth: {
    csrfToken: document.querySelector('meta[name="csrf-token"]').content
  }
});

• 服务端不要只在Socket.io连接建立时做一次身份校验，需要对每一次事件请求都做身份校验，同时限制单用户并发连接数、消息发送频率，避免被攻击者滥用。

内容的提问来源于stack exchange，提问作者Alireza