title: ReactJS + flux - how to handle session-like parameters (pseudoauthorization)
body: <p>Here's the usecase:</p>
  
  <p>I have 2 components in my reactjs application. Both components are fed with data from remote server - via websockets. I don't want my components nor stores to be aware of data source - all websocket logic resides in ActionCrators and something I call SocketListeners. </p>
  
  <p>Here's the example of such a listener:</p>
  
  <pre><code>var listen = function (socket) {
    socket
      .on(Messages.LIGHTS_CHANGED, function (newConfiguration) {
  
        AppDispatcher.dispatch({
          type: LightActionTypes.SUBSTITUTE_LIGHT_CONFIGURATION,
          payload: newConfiguration
        });
  
      })      
  };
  
  module.exports = {
    listen: listen
  };
  </code></pre>
  
  <p>Since it is a websocket, I need to know the remote url. 
  I'd like to ask my user to provide this url on my home page - and before that, my components (actually - routes) should not be available and user should be redirected to the page where he is able to specify this URL.</p>
  
  <p>So I need something which looks like a <strong>login flow</strong> - but instead of login and password, remote url is crucial property here.</p>
  
  <p>How would you manage this session-like state?</p>
  
  <p><strong>I tried something like this:</strong></p>
  
  <p>In my form-like home view I have a function:</p>
  
  <pre><code>handleConnectionConfirmed: function(event) {
      event.preventDefault();
      ActionCreator.saveRemoteUrl(
        this.state.remoteUrl
      );
    },
  </code></pre>
  
  <p>which causes to update my ConfigurationStore:</p>
  
  <pre><code>var _lightsUrl = '';
  var _temperatureUrl = '';
  
  var ConfigurationStore = {
    lightsSocketEndpoint: function () {
      return _lightsUrl;
    },
  
    temperatureSocketEndpoint: function () {
      return _temperatureUrl;
    }
  
  };
  </code></pre>
  
  <p>And then both my components have:</p>
  
  <pre><code>componentWillMount: function () {
      ActionCreator.init();
    },
  </code></pre>
  
  <p>Init function:</p>
  
  <pre><code>init: function () {
      _socket = WebSocketFactory.lightsWebSocket();
      SocketListener.listen(_socket);
    },
  </code></pre>
  
  <p>One last snippet:</p>
  
  <pre><code>lightsWebSocket: function () {
      return io.connect(
        ConfigurationStore.lightsSocketEndpoint()
      )
    },
  </code></pre>
  
  <p><strong>The problem is:</strong> as soon as I refresh any page, of course my ConfigurationStore is cleared. </p>
  
  <p>How can I make it <em>somehow</em> persistent without using an external storage?</p>
  
  <p>Also, do you know how can I configure react-router so that it could redirect me to 'login' page when no remote url is specified and user tries to open site where one of those components resides?</p>