详解nodejs通过响应回写的方式渲染页面资源


Posted in NodeJs onApril 07, 2018

我们一般通过node框架提供的api操作页面渲染,如何利用原始回写的方式来实现同样的功能呢

下面是通过node 提供的异步地读取一个文件的全部内容api readFile进行操作,代码如下:

html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link rel="stylesheet" type="text/css" href="./static/style.css" rel="external nofollow" />
  <title>Document</title>
</head>
<body>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <div>这是一个div </div>
  <script type="text/javascript" src="./static/test.js"></script>
 </body>
</html>

/static 文件夹里面放test.js 和 style.css 文件

div:nth-child(1){
  font-size: 50px;
  color: red;
}

div:nth-child(3){
  font-size: 80px;
  color: blue;
}

div:nth-child(6){
  font-size: 100px;
  color: blueviolet;
}

app.js

// 搭建服务
var http = require('http');
var fs = require('fs');
var server = http.createServer();
server.on('listening',()=> {
  console.log('server starts at localhost 8080');
})
server.listen('8080','localhost');

//监听服务
server.on('request',(req,res)=>{
  if(req.url == '/') {//渲染html文件
    fs.readFile('./html/node.html',(err,info)=>{
       res.write(info);
       res.end();
    })
  } else if(req.url.startsWith('/static')) {//统一渲染html需要的static静态文件到页面
    fs.readFile(__dirname + req.url,(err,info) =>{
      res.write(info);
      res.end();
    })
  }
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
nodejs win7下安装方法
May 24 NodeJs
nodejs开发微博实例
Mar 25 NodeJs
详解nodejs 文本操作模块-fs模块(五)
Dec 23 NodeJs
初识NodeJS服务端开发入门(Express+MySQL)
Apr 07 NodeJs
nodejs个人博客开发第六步 数据分页
Apr 12 NodeJs
详解nodejs异步I/O和事件循环
Jun 07 NodeJs
nodejs async异步常用函数总结(推荐)
Nov 17 NodeJs
Nodejs 和 Electron ubuntu下快速安装过程
May 04 NodeJs
NodeJS 将文件夹按照存放路径变成一个对应的JSON的方法
Oct 17 NodeJs
NodeJs crypto加密制作token的实现代码
Nov 15 NodeJs
nodejs如何在package.json中设置多条启动命令
Mar 16 NodeJs
用Nodejs实现在终端中炒股的实现
Oct 18 NodeJs
原生nodejs使用websocket代码分享
Apr 07 #NodeJs
nodejs多版本管理总结
Apr 03 #NodeJs
nodejs搭建本地服务器轻松解决跨域问题
Mar 21 #NodeJs
nodejs中密码加密处理操作详解
Mar 20 #NodeJs
nodejs连接mysql数据库及基本知识点详解
Mar 20 #NodeJs
nodejs基于express实现文件上传的方法
Mar 19 #NodeJs
nodejs+mongodb aggregate级联查询操作示例
Mar 17 #NodeJs
You might like
图形数字验证代码
2006/10/09 PHP
php实现建立多层级目录的方法
2014/07/19 PHP
优化WordPress中文章与评论的时间显示
2016/01/12 PHP
CI框架整合widget(页面格局)的方法
2016/05/17 PHP
如何通过View::first使用Laravel Blade的动态模板详解
2017/09/21 PHP
很棒的学习jQuery的12个网站推荐
2011/04/28 Javascript
一个js控制的导航菜单实例代码
2013/12/03 Javascript
如何在JavaScript中实现私有属性的写类方式(二)
2013/12/04 Javascript
JavaScript弹出窗口方法汇总
2014/08/12 Javascript
NodeJS学习笔记之Connect中间件模块(二)
2015/01/27 NodeJs
js实现双击图片放大单击缩小的方法
2015/02/17 Javascript
javascript实现简单的二级联动
2015/03/19 Javascript
JavaScript实现向setTimeout执行代码传递参数的方法
2015/04/16 Javascript
JavaScript动态添加事件之事件委托
2016/07/12 Javascript
js 获取站点应用名的简单实例
2016/08/18 Javascript
聊一聊Vue.js过渡效果
2016/09/07 Javascript
jquery 删除节点 添加节点 找兄弟节点的简单实现
2016/12/07 Javascript
bootstrap datetimepicker控件位置异常的解决方法
2017/11/23 Javascript
如何检查一个对象是否为空
2019/04/11 Javascript
VUE组件中的 Drawer 抽屉实现代码
2019/08/06 Javascript
Python编码时应该注意的几个情况
2013/03/04 Python
Python+django实现文件上传
2016/01/17 Python
详解python发送各类邮件的主要方法
2016/12/22 Python
Python实现的基数排序算法原理与用法实例分析
2017/11/23 Python
Python字符串内置函数功能与用法总结
2019/04/16 Python
Python实现的北京积分落户数据分析示例
2020/03/27 Python
python 实现超级玛丽游戏
2020/11/25 Python
Python的轻量级ORM框架peewee使用教程
2021/02/05 Python
英国屋顶用品和材料超市:Roofing Supplies UK
2019/08/24 全球购物
校长岗位职责
2013/11/26 职场文书
计算机专业毕业生求职信分享
2013/12/24 职场文书
我的求职计划书
2014/01/10 职场文书
初中英语课后反思
2014/04/25 职场文书
信用卡工资证明格式
2014/09/13 职场文书
2014年群众路线党员自我评议
2014/09/24 职场文书
MySQL事务的隔离级别详情
2022/07/15 MySQL