1. 为什么要用nodejs来渲染?

   之前前端的任务就是用HTML+CSS 来高保真的还原UI所设计原图,偶尔会使用少量的jq来对页面添加一些特效,页面还要交付给后端开发人员进行数据填充(php jsp)等模板语言,前后端依赖严重,几乎出现任何问题是只有前后端配合才能解决,后来的前后端分离,也就是前后端只用json来交流,前端通过使用ajax来进行数据填充,但是ajax的使用不利于SEO优化和首屏渲染,会造成额外的流量开销(主要在移动端)。

    我所设想的是nodejs只负责渲染页面,数据和后台逻辑还是由JAVA后台实现,nodejs使用JAVA提供的数据接口来对页面进行渲染。

    以下是代码部分略丑:

      

var express = require('express');
var router = express.Router();
var http = require('http');
// var getdata = require('../http');
/* GET home page. */
//主页
router.get('/', function(req, res, next) {
//创建请求
var xml = http.request({
host:"localhost",
port:3000,
method:"GET",
path:"/data/",
agent:false,
header:{
'Content-Type': 'application/json'
}
},function (resouce) {
resouce.setEncoding('utf-8');
resouce.on('data',function (progress) {
//此处是对接受的数据进行处理
res.render('index',JSON.parse(progress) );
});
resouce.on('end',function (data) {
    
});
xml.on('error',function (err) {
console.log('-----error------',err);
})
});
xml.end(); //告诉服务器此次请求结束
});
//模拟JAVA接口
router.get('/data',function (req, res, next) {
res.send({
"id":"单号",
"status":"流转单状态",
"data":"审批通过日期",
"business_data":"业务日期",
"company":"委托单位",
"bussiness_company":"业务分公司",
"bus_person":"业务员",
"provide_person":"运价提供人",
"handle_person":"操作分公司",
"handle_cus":"操作方客服",
"search":"查询",
"num":"序号",
"bus_id":"业务流转单号",
"work_num":"工作号",
"odd_id":"流转单类型",
"pass_date":"审批通过日期",
"company_client":"委托单位",
"bus_class":"业务类型",
"haulier":"承运人"
});
});
module.exports = router;

  app.js

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser'); var index = require('./routes/index');
var users = require('./routes/users');
var exphbs = require('express-handlebars');
var app = express(); // view engine setup
app.set('views', path.join(__dirname, 'views'));
//设置模板引擎
app.engine('hbs', exphbs({
layoutsDir: 'views',
defaultLayout: 'layout',
extname: '.hbs'
}));
app.set('view engine', 'hbs'); // uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static('public'));
app.use('/', index);
app.use('/users', users); // catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
}); // error handler
app.use(function(err, req, res, next) {
// set locals, only providing error in development
res.locals.message = err.message;
res.locals.error = req.app.get('env') === 'development' ? err : {}; // render the error page
res.status(err.status || 500);
res.render('error');
}); module.exports = app;

nodejs渲染模板的更多相关文章

  1. HTML5触屏版多线程渲染模板技术分享

    前言: 了解js编译原理的屌丝们都知道,js是单线程的,想当年各路神仙为了实现js的多线程,为了解决innerHTML输出大段HTML卡页面的顽疾,纷纷设计了诸如假冒的“多线程“实现,我自己也在写开源 ...

  2. JsRender 前端渲染模板常用API学习

    JsRender 常用API 1. $.templates() $.templates()方法是用来注册或编译模板的,使用的情况有以下几种. 把html字符串编译编译成模板 获取使用script标签声 ...

  3. JsRender 前端渲染模板基础学习

    JsRender前端渲染模板 使用模板,可以预先自定义一些固定格式的HTML标签,在需要显示数据时,再传入真实数据组装并展示在Web页中:避免了在JS中通过“+”等手动分割.连接字符串的复杂过程:针对 ...

  4. flask渲染模板时报错TypeError: 'UnboundField' object is not callable

    渲染模板时,访问页面提示TypeError: 'UnboundField' object is not callable 检查代码,发现实例化表单类是,没有加括号:form = NewNoteForm ...

  5. flask模板的基本用法(定界符、模板语法、渲染模板),模板辅助工具(上下文、全局对象、过滤器、测试器、模板环境对象)

    flask模板 在动态web程序中,视图函数返回的HTML数据往往需要根据相应的变量(比如查询参数)动态生成. 当HTML代码保存到单独的文件中时,我们没法再使用字符串格式化或拼接字符串的当时在HTM ...

  6. 云平台项目--学习经验--jsrender前端渲染模板

    jsrender的好处:可以预先自定义一些固定的html标签,在需要显示数据的时候,可以直接传入真实的数据并显示在web页面中,避免了Js编写中的复杂过程:针对高性能和纯字符串渲染并优化,不需要依赖D ...

  7. thinkphp3.2笔记(3)视图渲染 模板的赋值与显示 系统变量

    一  视图 1  视图渲染 渲染模板输出最常用的是使用display方法,调用格式:display('[模板文件]'[,'字符编码'][,'输出类型'])模板文件的写法支持下面几种:用法 描述不带任何 ...

  8. 前端渲染模板(一):Thymeleaf

    一.使用 本篇文章将以SpringBoot为框架来介绍Thymeleaf的用法. 1 资源文件的约定目录结构  Maven的资源文件目录:/src/java/resources spring-boot ...

  9. flask渲染模板

    Flask自身使用了jinja2模板,可以使用render_template()方法来渲染模板,只需要将模板名和关键字的参数传入. 该渲染模板的模块(views.py)会在 templates 文件夹 ...

随机推荐

  1. 网站过滤器Filter

    实际上,Filter与Servlet及其相似,区别只是FIlter的doFilter()方法里多了一个FilterChain的参数,通过该参数可以控制是否放行用户的请求.网站有了过滤器十分的方便,可以 ...

  2. 检测cpu是否支持虚拟化和二级地址转换【转】

    SLAT:二级地址转换   用微软的小工具“Coreinfo.exe” 下载地址是: http://technet.microsoft.com/en-us/sysinternals/cc835722 ...

  3. 《Linux内核设计与实现》课本第三章自学笔记——20135203齐岳

    <Linux内核设计与实现>课本第三章自学笔记 进程管理 By20135203齐岳 进程 进程:处于执行期的程序.包括代码段和打开的文件.挂起的信号.内核内部数据.处理器状态一个或多个具有 ...

  4. EF6 CodeFirst+Repository+Ninject+MVC4+EasyUI实践(八)

    前言 本篇幅将对系统的菜单管理模块进行说明,系统的菜单采用树形结构,这样可以更好地方便层级设计和查看.本示例将说明如何通过EntityFramework读取递归的菜单树形结构,以及结合EasyUI的t ...

  5. 安装Linux Mint

    1.尽量选择trusty的安装版本,kde和xfce不支持Win+..快捷键,推荐cinnamon:制作安装U盘后,选择非EFI模式启动:选择start Linux Mint(就是第一项): 2.In ...

  6. .Net消息队列的使用

    版权声明:作者:真爱无限 出处:http://blog.csdn.net/pukuimin1226 本文为博主原创文章版权归作者所有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出 ...

  7. HTML 中级2

    <colgroup> 标签用于对表格中的列进行组合,以便对其进行格式化. 通过使用 <colgroup> 标签,可以向整个列应用样式,而不需要重复为每个单元格或每一行设置样式. ...

  8. tab事件优化-事件代理

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. as3 代码优化之pmd

    首先下载com.abobe,ac.pmd.eclipse_...jar 和 flex-pmd-all-in-one...zip俩文件 前面一个装在xx\adobe flash builder xx\e ...

  10. mac idea中 maven项目添加的时候没有java文件

    file --other setting --maven  选中第二项即可  apply下