用Django, Orbited, Stomp 來完成Server Push 功能

現行的ajax大多都是需client有事情，才發request對server，拿資料做事。

如果換成server有事想通知web client呢？

用Django + Orbited + Stomp 就可以完成了。

Orbited : 很神奇的東西，用javascrip+html提供了socket的功能，所以在這socket上就可以實作各種東西。

等等會把stomp client和這在browser端整合。

Stomp：只要有stompclient，就可以接收stomp broker的message了。

首先進行安裝

easy_install install orbited
easy_install install stomp.py

在django project的目錄下，加上個orbited.cnf，內容是

[listen]
http://:9000
stomp://:61613

[access]
* -> localhost:61613

[global]
session.ping_interval = 300

把orbited跑起來

orbited -c orbited.cnf

在someapp/view.py下新增如下

from django.shortcuts import render_to_response
import stomp
conn = stomp.Connection()
conn.start()
conn.connect()
def index:
return render_to_response('index.html', {'dummy': "stupid"})
def stepEventHub(request):
conn.send(json.dumps({"msg":"server"}), destination="/EventHub")
return HttpResponse("ok")

記得去編輯一下urls.py

urlpatterns = patterns('someapp.views',
(r'^index/$', 'index'),
(r'^stepEventHub/$', 'stepEventHub'),
)

然後再編輯index.html一下網頁加上下列script

function main(){
stomp = new STOMPClient();
stomp.onopen = function(){
console.log("Open Stomp Client");
}
stomp.onclose = function(c){
alert("Lost connection, Code:"+c);
}
stomp.onerror = function(error){
alert("Error : " + error);
}
stomp.onerrorframe = function(frame){
alert("Error : " + frame.body);
}
stomp.onconnectedframe = function(){
console.log("Connected. Subcribing");
stomp.subscribe("/EventHub");
}
stomp.onmessageframe = function(frame){
var data = $.parseJSON(frame.body);
alert(data['msg']);
}
stomp.connect("localhost", 61613);
};
$(document).ready(main);

下載Orbited.js&stomp.js
stomp.js在protocol下。

最後說明一下stompclient 內容
onopen – 連線開始時候要呼叫的
onclose –連線結束時候要呼叫的
onerror – 當stompclinet有錯誤時呼叫
onerrorframe – 如果有錯誤的frame抵達時呼叫
onconnectedframe – 當client成功傳送以及接收frame時
onmessageframe – 當收到一個frame時

reset – 重設連線
connect – 連到stomp server

記得frame過來後，json是在body中，所以要用$.parseJSON(frame.body)才可以。

最後先打開網頁http://127.0.0.1:8000/someapp/
再開另外一個網頁http://127.0.0.1:8000/someapp/stepEventHub

就會在第一個網頁看到alert message了。

這裡有詳細範例。