React.js JWT Socket.io身份验证

Question

我正试图在React中使用Socket.io和Express Backend，后者使用JWT(Passport JWT)。在我通常的路线上，我的Auth没有问题。Authorization头被发送(Authorization Bearer Token)并在后端进行检查，但我根本不知道如何在从React Client发送数据时包括Bearer Token。

我已经查找了extraHeaders选项，但根本无法使其工作。

这是我的代码：

class Chat extends React.Component {
constructor(props) {
super(props);
this.state = {
username: "",
message: "",
messages: []
};

this.socket = io("localhost:5000", {
extraHeaders: {
Authorization: "My Bearer authorization_token_here"
}
});
this.socket.on("RECEIVE_MESSAGE", function(data) {
addMessage(data);
});
const addMessage = data => {
console.log(data);
this.setState({ messages: [...this.state.messages, data] });
console.log(this.state.messages);
};
this.sendMessage = ev => {
ev.preventDefault();
this.socket.emit("SEND_MESSAGE", {
author: this.state.username,
message: this.state.message
});
this.setState({ message: "" });
};
}
render() {jsx code here}

套接字连接已经建立，但是我不知道如何将令牌获取到服务器。理想情况下，我会在令牌中发送一个ID，在服务器上对其进行解码，并在数据库中查找有关用户的更多信息。

节日快乐，我很感激任何帮助或提示如何解决我的问题。

Answer 1

根据，文档extraHeaders只有在传输选项设置为轮询的情况下才能在浏览器中工作。

因此，在服务器端启用轮询，并使用以下片段

io({ 
transportOptions: {
polling: {
extraHeaders: {  "Authorization": "My Bearer authorization_token_here" }
},
}
});