PandaJS 使用说明(1.10)：总结

PandaJS 使用说明(1.10)：小结

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/
　　运行、调试、测试、部署：http://xxing22657-yahoo-com-cn.iteye.com/blog/1151963

Code Sample

　　【使用 MongoDB 进行数据管理】

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 }, { unique: true }); 
  
            users.insert({ name: "user1", desc: "desc1" });  
            users.insert({ name: "user2", desc: "desc2" });  
            users.insert({ name: "user3", desc: "desc3" });  
        });  
    }  
}();

　　见文章
　　http://xxing22657-yahoo-com-cn.iteye.com/blog/1158359

　　【使用 jQuery Template 语法进行服务器端页面渲染】

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();  
};

　　见文章
　　http://xxing22657-yahoo-com-cn.iteye.com/blog/1158359

　　【使用 Proxy 对象拦截方法调用（日志、权限控制、数据校验）】

(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 = { ... }  
}()); 

　　见文章
　　http://xxing22657-yahoo-com-cn.iteye.com/blog/1159366
　　http://xxing22657-yahoo-com-cn.iteye.com/blog/1159712

　　【服务器端与客户端共用代码】

　　可以共用的代码包括渲染代码、数据校验代码等，这里以共用渲染代码为例
　　（共用前面提到的 views.index(...)）。

　　服务器端代码：

page.index = function(params, req, res) {  
    return panda.render("index", function($){  
        views.index($, dbo.users.list());  
    });  
};

　　客户端代码：

$(function(){
	bind();

	// 其他代码，略

	// 每次修改数据时重新渲染页面、绑定事件    
	function show(users) {  
		views.index($, users);        
		bind();  
	}	
});

　　见文章
　　http://xxing22657-yahoo-com-cn.iteye.com/blog/1158359
　　http://xxing22657-yahoo-com-cn.iteye.com/blog/1159712

　　【客户端与服务器端之间的数据通信】

　　客户器端代码：

$(function(){  
    var request = {  
        action: "hello.say",  
        params: { name: "Panda" }  
    };  
  
    panda.post(request, function(data) {  
        $("#message").html(data);  
    });  
});

　　服务器端代码：

api.hello = {  
    say: function(params) {  
        return "Hello, " + params.name + "!";  
    }  
};

　　见文章 http://xxing22657-yahoo-com-cn.iteye.com/blog/1153849

编写 Java 和 JavaScript 扩展

　　【Java扩展】
　　直接在工程中创建 java 文件，或者将独立的 Java 工程导出的 jar 文件添加到 Build Path 中；
　　然后可以用 importPackage(...) 或者 JavaImporter 导入 java package，
　　可以参考 scripts/lib/panda 的写法。

　　【JavaScript 扩展】
　　在 scripts/lib 下创建新的文件夹。
　　启动应用时，文件夹名称将作为一个对象被创建，并执行文件夹中的所有 js 文件。
　　可以参考 scripts/lib/panda 的写法。

其他

　　HTML5 与 Flash 文件上传：见文章 http://xxing22657-yahoo-com-cn.iteye.com/blog/1154752
　　Spket 智能感知：见文章 http://xxing22657-yahoo-com-cn.iteye.com/blog/1155510
　　此外，PandaJS 支持热部署，修改 scripts/app 、 scripts/lib 、 webapp/js/both 下的 js 文件时不需要重启应用。