keakon的涂鸦馆

• 用channel的唯一token来连接channel，与sever建立长连接。
  
• 监听channel的数据并更新给用户。
  
• 发送数据给sever。
  

• 为每个Javascript client创建唯一的channel。
  
• 创建和发送唯一token给client。
  
• 接收client发送的POST数据。
  
• 通过channel来给client发送数据。
  

1. Client先发送请求，告诉Server它要建立一个Channel。
   
2. Server接收到请求后，根据Client ID来创建一个Channel，然后把这个Channel的token返回给Client。（实际上这个例子并不好，Client ID并不需要Client来发送，Server可以用登录的用户名或随机数来生成。）
   
3. Client接收到token，用这个token来建立Socket，连接到Channel。
   

1. Client B向Server发送POST请求。
   
2. Server接收到请求后，解析这个请求，并且将消息转发给指定的Channel。（根据你的需求，也可以转发给所有Channel）
   
3. Client A从Socket接收到Channel发来的消息，调用onmessage方法来响应这个消息。
   

class GetTokenHandler(webapp.RequestHandler):
	def get(self):
		user = users.get_current_user()
		if user:
			channel_id = id = user.email()
		else:
			id = random.randint(1, 1000)
			channel_id = 'anonymous(%s)' % id
		token = channel.create_channel(channel_id)
		tokens = memcache.get('tokens') or {}
		tokens[token] = id
		memcache.set('tokens', tokens)
		self.response.out.write(token)

var token;
function get_token() {
	$.get('/get_token', function(data){
		token = data;
		openChannel();
	});
}

function openChannel() {
	var channel = new goog.appengine.Channel(token);
	var handler = {
	  'onopen': onOpen,
	  'onmessage': onMessage,
	  'onerror': function() {},
	  'onclose': function() {}
	};
	channel.open(handler);
}

1. 用new goog.appengine.Channel(token)来创建Channel对象。（注意：需要载入/_ah/channel/jsapi这个JavaScript文件才能使用这个类。）
   
2. 构造一个handler来处理Channel发送的信息。
   
3. 将handler作为参数，调用Channel对象的open方法来建立socket连接。
   

• onopen：当socket成功建立时调用。是否定义它都无所谓，这里我让它通知服务器有新用户加入聊天室：
  

  function onOpen() {
  	$.post('/open', {'token': token});
  }

  class OpenHandler(webapp.RequestHandler):
  	def post(self):
  		token = self.request.get('token')
  		if not token:
  			return
  		tokens = memcache.get('tokens')
  		if tokens:
  			id = tokens.get(token, '')
  			if id:
  				if isinstance(id, int):
  					user_name = u'天朝匿名用户(%s)' % id
  				else:
  					user_name = id.split('@')[0]
  				message = user_name + u'加入了聊天室'
  				message = simplejson.dumps(message)
  				send_to_all(message, tokens)

  这里我让客户端发送token，服务器端则在memcache里根据token来获取Client ID，并用send_to_all()来广播通知其他Client有新用户加入：
  

  def send_to_all(message, tokens=None):
  	if not tokens:
  		tokens = memcache.get('tokens')
  	if tokens:
  		for token, id in tokens.iteritems():
  			if isinstance(id, int):
  				id = 'anonymous(%s)' % id
  			channel.send_message(id, message)

  注意就算没有用户接收Channel，channel.send_message()方法也不会抛出异常，所以需要自己来清除不再使用的channel。
  另外还得注意，send_message的参数是Client ID，而不是token。实际上token只在建立连接时有效，之后就没用了，但是我需要用它来获取Client ID，所以不能丢弃。
  
• onmessage：当接收到Channel发送的消息时调用。你不实现它就没有意义了，这里我用它来显示用户发送的消息：
  

  function onMessage(m) {
  	var message = $.parseJSON(m.data);
  	message = message.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
  	$msg.prepend('<blockquote><pre>' + message + '</pre></blockquote>');
  }

  class ReceiveHandler(webapp.RequestHandler):
  	def post(self):
  		token = self.request.get('token')
  		if not token:
  			return
  		message = self.request.get('content')
  		if not message:
  			return
  		tokens = memcache.get('tokens')
  		if tokens:
  			id = tokens.get(token, '')
  			if id:
  				if isinstance(id, int):
  					user_name = u'天朝匿名用户(%s)' % id
  				else:
  					user_name = id.split('@')[0]
  				message = '%s: %s' % (user_name, message)
  				message = simplejson.dumps(message)
  				if len(message) > channel.MAXIMUM_MESSAGE_LENGTH:
  					return
  				send_to_all(message)

  注意接收到的数据是个JSON对象，它的data属性才是真正的message。由于不能发送非ASCII字符，所以服务器端我采用了JSON编码，客户端则还需要parseJSON。
  
• onerror：socket出错时调用。为了简化，这里我就不做处理。
  
• onclose：Channel关闭时调用。注意Channel建立后2小时会过期，此时会调用onclose和onerror，可以捕捉这个事件，再次获取token来连接Channel。为了简化，这里我就不做处理。
  

function submit() {
	$.ajax({
		url: '/post_msg',
		type: 'POST',
		data: {'token': token, 'content': $content.val()}
	});
	$content.val('').focus();
}

$content.keypress(function(e) {
	if (e.shiftKey && e.keyCode == 13) {
		submit();
		return false;
	}
});
$('#submit_msg').click(submit);

$(window).bind('beforeunload', function() {
	$.post('/del_token', {'token': token});
})

class ReleaseTokenHandler(webapp.RequestHandler):
	def post(self):
		token = self.request.get('token')
		if not token:
			return
		tokens = memcache.get('tokens')
		if tokens:
			id = tokens.get(token, '')
			if id:
				if isinstance(id, int):
					user_name = u'天朝匿名用户(%s)' % id
				else:
					user_name = id.split('@')[0]
				message = user_name + u'离开了聊天室'
				message = simplejson.dumps(message)
				del tokens[token]
				memcache.set('tokens', tokens)
				send_to_all(message, tokens)

class LoginOrOut(webapp.RequestHandler):
	def get(self):
		if users.get_current_user():
			self.redirect(users.create_logout_url('/'))
		else:
			self.redirect(users.create_login_url('/'))

• 一个Channel只能用于一个Client。不过我在测试时，2个浏览器同时使用一个Channel也成功了。
  
• 一个页面上，一个Client只能连接一个Channel。（这个是HTTP协议里规定的，其他server push实现也会有这种限制的。）