Javascript 和後臺的配合

by thinker

關鍵字:

$javascript$ 時常用在網頁的互動，以增加網頁的使用性，乎 user 恰容易使用。而網頁的配置和風，由後臺的程式直接輸出 HTML 配合 CSS 來控制。這種的方式，使得後臺的程式摻雜著一寡 HTML 的 code ，看起非常的亂和複雜。在$緊緊$這個 project 內，我將使用介面完全對後臺程式拉出，後臺程式只負責提供資料，將資料轉成 $javascript$ 的變數，其它畫面的問題，交乎 $javascript$ 和 HTML template file 來處理。 HTML template file 是一個 HTML 摻 $javascript$ 的網頁，其中有一寡 $javascript$ 的變數，由後臺程式來提供。譬如:
{{{
<html>
<script>
var data = $$data$$;
</script>
<body>
<script>
  for(i = 0; i < data.length; i++) {
    document.write(data[i] + "<br>");
  }
</script>
</body>
</html>
}}}
咱的後臺程式將這個 template 對檔案內讀出，才將 data 這個變數設成
{{{
var data = Array("record1", "record2", ...);
}}}
這款形式，最後才送乎 client。

下腳這段是 $Python$ 的 code，可以將 $Python$ 的資料，轉成 $javascript$ 的形式。
{{{
def trans_to_$javascript$(data):                                                  
    from types import StringType, ListType, TupleType, NoneType                 
    if type(data) == StringType:                                                
        jstr = `data.decode('utf8')`[1:]                                        
    elif type(data) == ListType or type(data) == TupleType:                     
        data = map(lambda x: trans_to_$javascript$(x), data)                      
        jstr = 'Array(' + join(data, ', ') + ')'                                
    elif type(data) == NoneType:                                                
        jstr = 'null'                                                           
    else:                                                                       
        jstr = `data`                                                           
    return jstr                                                                 
}}}
另外，下面是取代 javascritp 變數的 $Python$ code:
{{{
def format_str_template(istr, data):                                            
    ostr = istr                                                                 
    for d in data.items():                                                      
        key = d[0]                                                              
        value = d[1]                                                            
        rep = '$$' + key + '$$'                                                   
        pos = ostr.find(rep)                                                    
        if pos >= 0:                                                            
            repstr = trans_to_$javascript$(value)                                 
            ostr = ostr[:pos] + repstr + ostr[pos + len(rep):]                  
    print ostr                                                                  
}}}
咱寫一寡 library 來幫咱做一寡固定的代誌，乎咱的程式更加容易維護和 debug。

透過這款設計，$緊緊$真清楚的分開 HTML 和 $Python$ code，乎你的程式清清氣氣。但是，這也是有缺點，像 google 這款 search engine ，可能無法度幫你做 search。那要避免這個問題，最好在 server side 執行 $javascript$，產生 HTML，如此 search engine 就能對純粹的 HTML 做分析。

最後更新時間: 2005-02-12 18:05:45 CST | 引用

查詢:

COMMENTS: