2017-11-15 1 views
0

私はcreate-react-appによって作成されたセットアップで作業し、データ管理のためにfluxを使用し、アプリケーションはクライアント側でソケットを実装する必要があります(この目的でsocket.ioを使用します)。現在、ソケットは、以下の方法ファイルSocket.jsに初期化されるユーザログイン時にソケットを再接続

:それは作業を行い

import io from 'socket.io-client'; 
import { remoteUrl } from './constants/RemoteUrl'; 
import SocketWorker from './utilities/SocketWorker'; 

let socket = io.connect(remoteUrl + '?role=user'); 

socket.on('statusChange', (data) => { 
    return SocketWorker.receiveOrderStatusChange(data); 
}) 

export { socket }; 

は、しかし、問題は、サイトがあるときにだけ、一度サーバーに接続しようとするということですロードされる。ユーザーが接続を確立せず、再接続に失敗した場合、接続は確立されず、ソケットイベントは受信されません。

代わりにクラスを作成し、のように:

import io from 'socket.io-client'; 
import { remoteUrl } from './constants/RemoteUrl'; 
import SocketWorker from './utilities/SocketWorker'; 

function Socket() { 
    this.socket = io.connect(remoteUrl + '?role=user'); 
    this.reconnect =() => { 
    this.socket = io.connect(remoteUrl + '?role=user'); 
    } 
} 

let socket = new Socket(); 

socket.socket.on('statusChange', (data) => { 
    return SocketWorker.receiveOrderStatusChange(data); 
}) 

export { socket }; 
私はSocket.reconnect()メソッドを呼び出そうとしましたが、機能しなかったし、接続も確立されませんでした。任意のアイデアや代替ソリューション?

答えて

0

私は誰もがSocket.ioのAPIと同じ問題に直面した場合、これを解決するために、管理方法:

まず、あなたはコンストラクタによって作成されたオブジェクトにあなたのソケットをカプセル化する必要がありますが、作成する必要はありません接続がすでに存在しているような方法を再接続し、A(および認証が放出されるイベントを通じて処理することができ、私は以下について説明します):

import {socket} from './Socket'; 

import io from 'socket.io-client'; 
import { remoteUrl } from './constants/RemoteUrl'; 
import SocketWorker from './utilities/SocketWorker'; 

function Socket() { 
    this.socket = io.connect(remoteUrl + '?role=user'); 

    this.socket.on('statusChange', (data) => { 
    return SocketWorker.receiveOrderStatusChange(data); 
    }) 
}; 

const socket = new Socket(); 

export { socket }; 

あなたはどこでもあなたのプロジェクト内のソケットをインポートすることができます

そして、あなたが呼び出すことができます。サーバー側で

socket.socket.emit('joinRoleRoom','user'); 
socket.socket.emit('joinIdRoom', _user._id); 

を、あなただけの、次のようにこれらのイベントを取り扱う必要があります。

socket.on('joinRoleRoom', (role) => { 
    socket.join(role) 
    console.log('Client joined to: ' + role); 
}); 
socket.on('joinIdRoom', (id) => { 
    console.log('Client joined to: ' + id); 
    socket.join(id) 
}); 

ソケットが得られ、その認証情報に基づいて必要な部屋に参加します認証プロセス中に