详解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 url验证(url-valid)的使用方法
Nov 18 NodeJs
NodeJS中Buffer模块详解
Jan 07 NodeJs
ubuntu下安装nodejs以及升级的办法
May 08 NodeJs
nodejs加密Crypto的实例代码
Jul 07 NodeJs
Jquery通过ajax请求NodeJS返回json数据实例
Nov 08 NodeJs
nodejs模块学习之connect解析
Jul 05 NodeJs
Nodejs之TCP服务端与客户端聊天程序详解
Jul 07 NodeJs
nodejs构建本地web测试服务器 如何解决访问静态资源问题
Jul 14 NodeJs
详解NodeJs开发微信公众号
May 25 NodeJs
详解NodeJs项目 CentOs linux服务器线上部署
Sep 16 NodeJs
NodeJs crypto加密制作token的实现代码
Nov 15 NodeJs
nodejs脚本centos开机启动实操方法
Mar 04 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
实用PHP会员权限控制实现原理分析
2011/05/29 PHP
PHP编程获取各个时间段具体时间的方法
2017/05/26 PHP
PHP实现验证码校验功能
2017/11/16 PHP
Laravel监听数据库访问,打印SQL的例子
2019/10/24 PHP
php高性能日志系统 seaslog 的安装与使用方法分析
2020/02/29 PHP
javascript 表格排序和表头浮动效果(扩展SortTable)
2009/04/07 Javascript
JavaScript 常用函数库详解
2009/10/21 Javascript
jQuery图片预加载 等比缩放实现代码
2011/10/04 Javascript
js中的onchange和onpropertychange (onchange无效的解决方法)
2014/03/08 Javascript
javascript搜索框点击文字消失失焦时文本出现
2014/09/18 Javascript
js实现随屏幕滚动的带缓冲效果的右下角广告代码
2015/09/04 Javascript
原生js的数组除重复简单实例
2016/05/24 Javascript
浅谈JavaScript正则表达式-非捕获性分组
2017/03/08 Javascript
jQuery实现表格奇偶行显示不同背景色 就这么简单
2017/03/13 Javascript
js 原生判断内容区域是否滚动到底部的实例代码
2017/11/15 Javascript
基于vue cli重构多页面脚手架过程详解
2018/01/23 Javascript
JS实现二维数组横纵列转置的方法
2018/04/17 Javascript
JavaScript实现选项卡效果的分析及步骤
2019/04/16 Javascript
[01:56]《DOTA2》中文配音CG
2013/04/22 DOTA
python 打印对象的所有属性值的方法
2016/09/11 Python
python获取网页中所有图片并筛选指定分辨率的方法
2018/03/31 Python
Python 中的参数传递、返回值、浅拷贝、深拷贝
2019/06/25 Python
浅谈Python 递归算法指归
2019/08/22 Python
python 实现矩阵按对角线打印
2019/11/29 Python
Django返回HTML文件的实现方法
2020/09/17 Python
python 绘制场景热力图的示例
2020/09/23 Python
Stefania Mode英国:奢华设计师和时尚服装
2017/10/23 全球购物
PHP数据运算类型都有哪些
2013/11/05 面试题
销售部主管岗位职责
2013/12/18 职场文书
浙大毕业生自荐信
2014/01/26 职场文书
新农村建设标语
2014/06/24 职场文书
党的群众路线教育实践活动自我剖析材料
2014/10/08 职场文书
如何写新闻稿
2015/07/18 职场文书
汽车销售员工作总结
2015/08/12 职场文书
倡议书怎么写?
2019/04/11 职场文书
【DOTA2】高能暴走TK秀!PSG LGD vs ASTER - DPC 2022 WINTER TOUR CN
2022/04/02 DOTA