nodejs渲染模板
- 为什么要用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渲染模板的更多相关文章
- HTML5触屏版多线程渲染模板技术分享
		前言: 了解js编译原理的屌丝们都知道,js是单线程的,想当年各路神仙为了实现js的多线程,为了解决innerHTML输出大段HTML卡页面的顽疾,纷纷设计了诸如假冒的“多线程“实现,我自己也在写开源 ... 
- JsRender 前端渲染模板常用API学习
		JsRender 常用API 1. $.templates() $.templates()方法是用来注册或编译模板的,使用的情况有以下几种. 把html字符串编译编译成模板 获取使用script标签声 ... 
- JsRender 前端渲染模板基础学习
		JsRender前端渲染模板 使用模板,可以预先自定义一些固定格式的HTML标签,在需要显示数据时,再传入真实数据组装并展示在Web页中:避免了在JS中通过“+”等手动分割.连接字符串的复杂过程:针对 ... 
- flask渲染模板时报错TypeError: 'UnboundField' object is not callable
		渲染模板时,访问页面提示TypeError: 'UnboundField' object is not callable 检查代码,发现实例化表单类是,没有加括号:form = NewNoteForm ... 
- flask模板的基本用法(定界符、模板语法、渲染模板),模板辅助工具(上下文、全局对象、过滤器、测试器、模板环境对象)
		flask模板 在动态web程序中,视图函数返回的HTML数据往往需要根据相应的变量(比如查询参数)动态生成. 当HTML代码保存到单独的文件中时,我们没法再使用字符串格式化或拼接字符串的当时在HTM ... 
- 云平台项目--学习经验--jsrender前端渲染模板
		jsrender的好处:可以预先自定义一些固定的html标签,在需要显示数据的时候,可以直接传入真实的数据并显示在web页面中,避免了Js编写中的复杂过程:针对高性能和纯字符串渲染并优化,不需要依赖D ... 
- thinkphp3.2笔记(3)视图渲染 模板的赋值与显示 系统变量
		一 视图 1 视图渲染 渲染模板输出最常用的是使用display方法,调用格式:display('[模板文件]'[,'字符编码'][,'输出类型'])模板文件的写法支持下面几种:用法 描述不带任何 ... 
- 前端渲染模板(一):Thymeleaf
		一.使用 本篇文章将以SpringBoot为框架来介绍Thymeleaf的用法. 1 资源文件的约定目录结构 Maven的资源文件目录:/src/java/resources spring-boot ... 
- flask渲染模板
		Flask自身使用了jinja2模板,可以使用render_template()方法来渲染模板,只需要将模板名和关键字的参数传入. 该渲染模板的模块(views.py)会在 templates 文件夹 ... 
随机推荐
- LoadRunner ERROR: java.lang.NumberFormatException
			Loadrunner中使用lr_xml_get_values()获取服务端返回的字符串LcsId,LcsId为double,需要将该值转换为 int 后传入下一次请求中. 报错如下:Error is ... 
- 关于app的具体实施
			鉴于我们小组做的app是关于在线做题和游戏相融合的,所以,我会先学习UI设计,毕竟好的UI设计不仅会给用户耳目一新的体验,同时还会让用户愿意去包容一些小BUG,但如果你的软件做的非常好,功能提供的很全 ... 
- 数据类型和Json格式(转载)
			作者: 阮一峰 日期: 2009年5月30日 1. 前几天,我才知道有一种简化的数据交换格式,叫做yaml. 我翻了一遍它的文档,看懂的地方不多,但是有一句话令我茅塞顿开. 它说,从结构上看,所有的数 ... 
- php实现递归的三种方式: 遍历文件夹实例
			递归函数是我们常用到的一类函数,最基本的特点是函数自身调用自身,但必须在调用自身前有条件判断,否则无限无限调用下去.实现递归函数可以采取什么方式呢?本文列出了三种基本方式.理解其原来需要一定的基础知识 ... 
- mybatis-generator-config工具的使用
			generator.xml <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE gener ... 
- Xcode7免证书真机调试
			最近一直忙于项目,对于Xcode7的一些新功能还没去尝试,今天尝试了下挺好用的!避免了以前真机调试繁琐的配置,很是爽啊.又可以节约很多小伙伴的时间了.废话不多说咱们一起来配置一下. 第一步 打开需要真 ... 
- 【PCB】电子元件封装大全及封装常识
			电子元件封装大全及封装常识 电子元件封装大全及封装常识 一.什么叫封装封装,就是指把硅片上的电路管脚,用导线接引到外部接头处,以便与其它器件连接.封装形式是指安装半导体集成电路芯片用的外壳.它不仅起着 ... 
- 项目中常用的linux命令
			1. du -sm * | sort -n 把当前目录下的文件(或目录)按大小排序,看下哪个地方占用最多: 2. pwd 获取当前目录路径 3. tail -f ... 
- 【转】2014年25款最好的jQuery插件
			2014年25款最好的jQuery插件 来源:Specs' Blog-就爱PHP 时间:2014-12-30 10:24:10 阅读数:2267 分享到: 0 http://www.php10 ... 
- linux操作命令
			cd / 回到跟目录 cd .. 返回上一层目录 tomcat 的logs目录执行tail -f catalina.out查看日志 ps -ef|grep tomcat 查看tomcat进程 kil ... 
