Node.js 由服务端发送渲染页面到客户端

var template = require('art-template');
var http = require('http');
var Fs = require('fs');
var Server = http.createServer();
Server.on('request',function(request,response){
    
    
    var url = request.url;
    if(url === '/render'){
    
    

/*
   1.读取相应html文件， 并用模板引擎完成相应的渲染
   2.默认读取到的文件内容是二进制数据，而模板引擎的 render 方法需要接收的数据格式是字符串，所以需要用到 toString() 来转换接收  
   3.服务端发送 render(渲染) 成功的对象， 由客户端进行解析加载
*/
        Fs.readFile('./dist/html/tpl.html',function(error,data){
    
    
            if(error){
    
    
                return response.end('ReadFile failure!');
            }else{
    
    
                //渲染函数
                var vm = template.render(data.toString(),{
    
    
                    name: 'Vodka',
                    Province: 'GuangDong',
                    hobbies: ['Guitar','Running','Burying on book','Honor of king','Singing']
                });
                return response.end(vm);
            }
        });
    }
});
Server.listen(3000,function(){
    
    
    console.log('The Server had been started, you can access from ip and port : http://127.0.0.1:3000');
});

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>template</title>
</head>
<body>
    <h1>{
   
   { name }}'s Infomation </h1>
    <h2>I'm come from {
   
   { Province }} province . </h2>
    <h3>favor to: {
   
   { each hobbies }} {
   
   { $value }}, {
   
   { /each }}</h3>
</body>
</html>

在这里插入图片描述

Node.js 由服务端发送渲染页面到客户端

猜你喜欢