6
这是我第一次在生产中使用socket.io。我正在使用React + Redux。我最近将socket.io与redux整合在一起，并且它的工作正常，但我不确定这是否是最好的方法来完成我的工作。因为我还没找到任何适当的socket.io实现与redux，我需要一些帮助/建议的方式，如果我可以改进它。与redux一起使用socket.io
所以，对于初学者我已经安装了管理插槽遍布应用服务：
Socket.js
import isEmpty from 'lodash/isEmpty';
import io from 'socket.io-client';
import storage from '../storage';
/* eslint-disable no-use-before-define */
const Socket = {
connect,
emit,
on,
removeListener,
socket: null
};
/* eslint-enable no-use-before-define */
function connect() {
const hasAuthenticated = !isEmpty(storage.get('user'));
if (hasAuthenticated) {
// Setup a server for testing.
Socket.socket = io.connect('http://localhost:3000', { reconnect: true });
}
}
connect();
function on(eventName, callback) {
if (Socket.socket) {
Socket.socket.on(eventName, data => {
callback(data);
});
}
}
function emit(eventName, data) {
if (Socket.socket) {
Socket.socket.emit(eventName, data);
}
}
function removeListener(eventName) {
if (Socket.socket) {
Socket.socket.removeListener(eventName);
}
}
export default Socket;
我只用一个单一的页面中使用它，但ofcourse有将更多页面。我该网页终极版compositon是：
Dashboard.jsx
componentWillMount() {
this.props.alertViolations(); // Action
}
componentWillUnmount() {
this.props.unsubscribeViolations(); // Action
}
Actions.js
export function alertViolations() {
return dispatch => {
Socket.on('violations', violation => {
dispatch(actions.updateViolations(violation));
});
};
}
export function unsubscribeViolations() {
Socket.removeListener('violations');
return dispatch => {
dispatch(actions.removeViolationsListener());
};
}
其工作的罚款。在卸载时，它会停止监听服务器上的放射功能。我真的很感激，如果我能得到关于一些建议：
- 我需要设置一个中间件以更美好 和抽象的方式来管理插座？
- 有没有更好的方法来管理与redux套接字？
- 如何使用内置的
connect和disconnect功能？ - 我已经处理的方式只建立连接，如果用户有身份验证，那很好吗？或者有没有更好的方法来处理这个问题呢？
- 哦，还有，如果我想在注销时删除连接？我只需要从所有方法中删除监听器，或者我可以在注销操作中使用断开连接功能吗？
非常感谢。请让我知道，如果我错过了任何解释。