2012-03-06 87 views
0

那麼,我的使用的eventsource正在崩潰我的瀏覽器。eventsource正在崩潰我的瀏覽器

我有一個顯示狀態表的簡單頁面,並且偵聽服務器的JavaScript發送更新事件。我使用jquery.eventsource來進行偵聽,jQuery版本爲1.6.2,並且我將Firefox 10作爲我的瀏覽器運行。在服務器上我使用python 2.7.2和cherrypy 3.2.2

如果我離開狀態頁面運行,並且不刷新它,那麼它似乎沒有問題。如果我多次刷新頁面(最後一次計數爲15),或者多次瀏覽和瀏覽頁面,那麼一分鐘後瀏覽器崩潰。

什麼可能導致這次崩潰?

我已經嘗試過使用谷歌Chrome 17.0.963.78米,但看起來不錯。 Chrome不會崩潰。

這是我的JavaScript(status.js):

jQuery(document).ready(function() 
      { 
      jQuery.eventsource(
       { 
       label: 'status-source', 
       url: 'statusUpdates', 
       dataType: 'json', 
       open: function(data){}, 
       message: function(data) 
       { 
        cell = jQuery('#'+data.htmlID); 
        cell.text(data.value); 
       } 
       } 
      ); 
      } 
     ); 

這是HTML:

<html> 
    <head> 
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8"> 
    <title>Event source test page</title> 
    <script src="js/jquery.js" type="text/javascript"></script> 
    <script src="js/jquery.eventsource.js" type="text/javascript"></script> 
    <script src="js/status.js" type="text/javascript"></script> 
    </head> 
    <body> 
    <table> 
     <tr> 
    <th>name</th><th>value</th> 
     </tr> 
     <tr> 
    <td>Heads</td><td id="headval">4</td> 
     </tr> 
     <tr> 
    <td>Hands</td><td id="handval">16</td> 
     </tr> 
     <tr> 
    <td>Feet</td><td id="feetval">24</td> 
     </tr> 
     <tr> 
    <td>Eyes</td><td id="eyeval">18</td> 
     </tr> 
     <tr> 
    <td>Fingers</td><td id="fingerval">1</td> 
     </tr> 
    </table> 
    </body> 
</html> 

這是CherryPy的服務器

import cherrypy 
import os 
import Queue 
import threading 
import random 
import json 

class Server(object): 

    def __init__(self): 
     self.isUpdating = True 
     self.statusUpdateList = Queue.Queue() 
     self.populateQueue() 
     threading.Timer(1, self.queuePopulationRepetition).start() 

    def stop(self): 
     self.isUpdating = False 

    def queuePopulationRepetition(self): 
     self.populateQueue() 
     if self.isUpdating: 
      threading.Timer(1, self.queuePopulationRepetition).start() 

    def populateQueue(self): 
     self.statusUpdateList.put(json.dumps({ 'htmlID':'headval', 'value':random.randint(0,50) })) 
     self.statusUpdateList.put(json.dumps({ 'htmlID':'handval', 'value':random.randint(0,50) })) 
     self.statusUpdateList.put(json.dumps({ 'htmlID':'feetval', 'value':random.randint(0,50) })) 
     self.statusUpdateList.put(json.dumps({ 'htmlID':'eyeval', 'value':random.randint(0,50) })) 
     self.statusUpdateList.put(json.dumps({ 'htmlID':'fingerval', 'value':random.randint(0,50) })) 

    @cherrypy.expose 
    def index(self): 
     f = open('index.html', 'r') 
     indexText = '\n'.join(f.readlines()) 
     f.close() 
     return indexText 

    @cherrypy.expose 
    def statusUpdates(self, _=None): 
     cherrypy.response.headers["Content-Type"] = "text/event-stream" 
     self.isViewingStatus = True 
     if _: 
      data = 'retry: 400\n' 
      while not self.statusUpdateList.empty(): 
       update = self.statusUpdateList.get(False) 
       data += 'data: ' + update + '\n\n' 
      return data 
     else: 
      def content(): 
       update = self.statusUpdateList.get(True, 400) 
       while update is not None: 
        data = 'retry: 400\ndata: ' + update + '\n\n' 
        update = self.statusUpdateList.get(True, 400) 
        yield data 
      return content() 
    statusUpdates._cp_config = {'response.stream': True, 'tools.encode.encoding':'utf-8'}     


if __name__ == "__main__": 

    current_dir = os.path.dirname(os.path.abspath(__file__)) 

    cherrypy.config.update({'server.socket_host': '0.0.0.0', 
          'server.socket_port': 8081, 
          }) 

    conf = { 
      "/css" : { 
       "tools.staticdir.on": True, 
       "tools.staticdir.dir": os.path.join(current_dir, "css"), 
       }, 
      "/js" : { 
       "tools.staticdir.on": True, 
       "tools.staticdir.dir": os.path.join(current_dir, "js"), 
       }, 
      "/images" : { 
       "tools.staticdir.on": True, 
       "tools.staticdir.dir": os.path.join(current_dir, "images"), 
       }, 
     } 

    cherrypy.quickstart(Server(), "", config=conf) 

回答

2

至於我能告訴,這是崩潰瀏覽器的jQuery插件。我已經改寫了javascript來使用一個普通的對象,這似乎解決了這個問題。

jQuery(document).ready(function() 
         { 
          var source = new EventSource('statusUpdates'); 
          source.addEventListener('message', 
                function(receivedObject) 
                { 
                 var data = jQuery.parseJSON(receivedObject.data); 
                 var cell = jQuery('#'+data.htmlID); 
                 cell.text(data.value); 
                 var status = cell.siblings(':last'); 
                 status.removeClass(); 
                 status.addClass(data.status); 
                }, false); 

         } 
        );