2016-04-23 22 views
4

httpリクエスト後にredux/react-nativeをsocket.io に接続するための提案はありますか?私は、認証セッションCookieを格納するためにまずHTTPリクエストを作成し、次にsocket.ioに接続する必要があります。見たすべての例(つまりhttps://www.npmjs.com/package/redux-socket.io)はすぐにsocket.ioに接続します。私の考えは行動に耳を傾け、カスタムReduxのミドルウェアにとても似接続です:React-native Redux socket.ioセッション認証

import React from 'react-native' 
import * as actions from './actions/'; 
import io from 'socket.io-client/socket.io'; 

export default socketMiddleware = (store) => { 
    return next => action => { 
    const result = next(action); 
    // var socket = io(); 
    // 
    if (action.type === 'HTTP_CONNECT_SUCCEEDED') { 
     debugger; 
     const socket = io('localhost:3000', {jsonp: false); 
     socket.on('connect', function(){console.log('Connected!')}); 
    } 
    // 
    // socket.on('message', data => { 
    // store.dispatch(actions.addResponse(data)); 
    // }); 
    // 
    // if (socket && action.type === actions.ADD_MESSAGE) { 
    // let messages = store.getState().messages; 
    // socket.emit('message', messages[messages.length -1]); 
    // } 

    return result; 
    }; 
} 

これは、接続するために動作しますが、私は「HTTP_CONNECT_SUCCESS」条件付きの内側に私のソケットを定義する必要があり、そう私の他のソケットのアクションやイベントがありますそのアクションが起こるまでは未定義です。アクションでWSに接続し、ソケットイベントやその他のアクションを公開するにはどうしたらいいですか?

答えて

0

マイうまくいけば一時的なハックは、私のソケットが変数グローバル行い、条件付きでイベントをラップすることです:

import React from 'react-native' 
import * as actions from './actions/'; 
import io from 'socket.io-client/socket.io'; 

export default socketMiddleware = (store) => { 
    return next => action => { 

    const result = next(action); 
    globalSocket = typeof globalSocket === 'undefined' ? false : globalSocket 

    if (action.type === 'HTTP_CONNECT_SUCCEEDED') { 
     globalSocket = io('http://localhost:3000', {jsonp: false}); 
     globalSocket.on('connect',() => { 
     console.log('Connected!') 
     }); 
    } 

    if (globalSocket != false) { 
     globalSocket.on('friends', data => { 
     store.dispatch(actions.updateFriends(data)); 
     }) 

     if (action.type === 'CREATE_QUESTION') { 
     globalSocket.emit('createQuestion', action.question); 
     } 
    } 

    return result; 
    }; 
} 
+0

わずかな改善ができますが、グローバル、すなわち 'VARの代わりに' var'を使用することができます'globalSocket = typeof ...'の代わりに 'socket = null'を使用します。 'if(action.type === 'HTTP_CONNECT_SUCCEEDED')'の中で 'socket'をセットし、' if(globalSocket!= false) 'を' if(socket) 'に変更します。 – BarthesSimpson

関連する問題