PandaJS使用說明(1.10):小結

PandaJS 是基於 Rhino、MongoDB、Server-side jQuery Template 的 JS 編程工具包,目標是使用更一致的方式編寫客戶端和服務器端的 js 代碼。它采用嵌入式的 Jetty 作為 Web Server,依賴於 Java 7。
  PandaJS 在服務器端的頁面渲染也采用 JQuery Template 的語法,而數據庫操作接口的語法與 Mongo Shell 上直接執行的原生語法非常接近。這使得我們可以在服務器端和客戶端共用頁面渲染代碼,並且可以直接使用從前端傳遞過來的 JavaScript 對象與數據庫進行交互。
  Google Code 上的項目地址:http://code.google.com/p/pandajs/
 Code Sample

  【使用 MongoDB 進行數據管理】
Javascript代碼 
dbo.users = function(){   
    var users = panda.db.get("users");   
    return {   
        list: function() {   
            if (!users.count()) { init(); }   
            return users.list().$sort({ name: 1 });   
        },   
        add: function(user) {   
            users.insert(user);   
            return this.list();   
        },   
        update: function(user) {   
            var q = { name: user.name };   
            users.update(q, user, true, false);   
            return this.list();   
        },   
        remove: function(name) {   
            users.remove({ name: name });   
            return this.list();   
        }   
    };   
 
    function init() {   
        panda.db.eval(function(){   
            var users = db.users;   
            users.drop();   
            users.ensureIndex({ name: 1 });   
   
            users.insert({ name: "user1", desc: "desc1" });   
            users.insert({ name: "user2", desc: "desc2" });   
            users.insert({ name: "user3", desc: "desc3" });   
        });   
    }   
}(); 

    【使用 jQuery Template 語法進行服務器端頁面渲染】
Javascript代碼 
var views = {};   
   
views.index = function($, users) {   
    var content = $("#content-tmpl").tmpl(),   
        rows = $("#user-tmpl").tmpl(users);   
       
    $("#content").html(content);   
    $("#content tr:first").after(rows);   
    $("#error").hide();   
}; 

    【使用 Proxy 對象攔截方法調用(日志、權限控制、數據校驗)】
Javascript代碼 
(function() {   
    var log = panda.log("proxy.security");   
   
    proxy.security = { priority: 80 };   
   
    // 對 page.* 的調用進行權限控制   
    proxy.security.page = {   
        priority: 100,   
        expr: /^page./,   
        func: function(name, method, args) {   
            // 獲取方法的第二個參數,即 req   
            var req = args[1];   
   
            // 讀取 session 中的role。返回值是 java.lang.String   
            // 加上空字符串轉為 JavaScript 中的 String   
            var role = req.session.getAttribute("user.role") + "";   
   
            // 如果角色是 "admin",則顯示相應頁面   
            // 否則,顯示登錄頁面   
            if (role === "admin") {   
                return this[method].apply(this, args);   
            } else {   
                log.info("Redirect to login page.");   
                return panda.render("login");   
            }   
        }   
    }   
   
    // 利用類似的方法對 api.* 的調用進行權限控制,略   
    proxy.security.api = { … }   
}());  

    【服務器端與客戶端共用代碼】

  可以共用的代碼包括渲染代碼、數據校驗代碼等,這裡以共用渲染代碼為例
  (共用前面提到的 views.index(…))。

  服務器端代碼:
Javascript代碼 
page.index = function(params, req, res) {   
    return panda.render("index", function($){   
        views.index($, dbo.users.list());   
    });   
}; 

  客戶端代碼:
Javascript代碼 
$(function(){ 
    bind(); 
 
    // 其他代碼,略 
 
    // 每次修改數據時重新渲染頁面、綁定事件     
    function show(users) {   
        views.index($, users);         
        bind();   
    }    
}); 

    【客戶端與服務器端之間的數據通信】

  客戶器端代碼:
Javascript代碼 
$(function(){   
    var request = {   
        action: "hello.say",   
        params: { name: "Panda" }   
    };   
   
    panda.post(request, function(data) {   
        $("#message").html(data);   
    });   
}); 


  服務器端代碼:
Javascript代碼 
api.hello = {   
    say: function(params) {   
        return "Hello, " + params.name + "!";   
    }   
}; 

作者“裴小星的博客”
 

You May Also Like