“现有的订阅频道”，而只有一次订阅(“Existing subscription to channe

我有一个小片段抛出，即使我只能拨打一次订阅方法的“现有订阅频道”的例外。

这可以通过移动“state_change”处理程序之外的预约请求是可以避免的，但我想知道什么可能导致此？也许在推杆库中的缺陷？

<!doctype html>
<html>
<body>
    <h1>Pusher subscribe testcase</h1>
    <p>Tip: check your console</p>
    <script src="https://d3dy5gmtp8yhk7.cloudfront.net/2.1/pusher.min.js"></script>
    <script>
        var pusher, channel;
        pusher = new Pusher('xxxxxxxxxxxxxxxxx');
        pusher.connection.bind('state_change', function(change){
            if(change.current === 'connected'){
                console.log('connected');
                channel = pusher.subscribe('test-channel');
                channel.bind('pusher:subscription_succeeded', function() {
                    console.log('subscribed');
                });
            }
        })
    </script>
</body>
</html>

这导致：

connected
subscribed
Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":null,"message":"Existing subscription to channel test-channel"}}}

Answer 1:

虽然它看起来像在图书馆中的错误（做报告吧！），你不需要绑定到state_change事件，以订阅频道。

如果你看一下在订阅事件的代码pusher.js ：

prototype.subscribe = function(channel_name) {
  var self = this;
  var channel = this.channels.add(channel_name, this);

  if (this.connection.state === 'connected') {
    channel.authorize(this.connection.socket_id, function(err, data) {
      if (err) {
        channel.handleEvent('pusher:subscription_error', data);
      } else {
        self.send_event('pusher:subscribe', {
          channel: channel_name,
          auth: data.auth,
          channel_data: data.channel_data
        });
      }
    });
  }
  return channel;
};

你会看到，它会在您的频道首先添加到经通道的内部列表channels.add方法，它看起来是这样的：

prototype.add = function(name, pusher) {
  if (!this.channels[name]) {
    this.channels[name] = createChannel(name, pusher);
  }
  return this.channels[name];
};

这只会增加的情况下，你以前没有订阅的频道。

所以，如果你要订阅建立连接前的通道，推动客户端只会通道添加到列表中。一旦客户端建立连接后，它会调用subscribe再次经由其列表中的每个通道的方法subscribeAll方法：

this.connection.bind('connected', function() {
  self.subscribeAll();
});

而当看到在这一点上this.connection.state 被 connected ，它将连接。

因此，重新盖上，不要打扰结合的state_change事件订阅，订阅刚，就像这样：

<!doctype html>
<html>
<body>
    <h1>Pusher subscribe testcase</h1>
    <p>Tip: check your console</p>
    <script src="https://d3dy5gmtp8yhk7.cloudfront.net/2.1/pusher.js"></script>
    <script>
        var pusher, channel;

        pusher = new Pusher('XXXXXXXXXXXXXXXX');
        channel = pusher.subscribe('test-channel');
        channel.bind('pusher:subscription_succeeded', function() {
            console.log('subscribed');
        });
    </script>
</body>
</html>

Answer 2:

It looks like a bug. If you open up the Network tab in dev tools and look at the WebSocket connection "Frames" information you can see the pusher:subscribe protocol event being sent twice. However, the code is definitely only calling pusher.subscribe once.

You should raise this bug with Pusher support or by submitting an issue to the github repo.