详解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实用示例 缩址还原
Dec 28 NodeJs
基于 Docker 开发 NodeJS 应用
Jul 30 NodeJs
NodeJS学习笔记之网络编程
Aug 03 NodeJs
基于NodeJS的前后端分离的思考与实践(二)模版探索
Sep 26 NodeJs
NodeJs读取JSON文件格式化时的注意事项
Sep 25 NodeJs
Nodejs下DNS缓存问题浅析
Nov 16 NodeJs
nodejs连接mysql数据库简单封装示例-mysql模块
Apr 10 NodeJs
NodeJs中express框架的send()方法简介
Jun 20 NodeJs
nodejs实现截取上传视频中一帧作为预览图片
Dec 10 NodeJs
nodejs使用async模块同步执行的方法
Mar 02 NodeJs
nodejs实现百度舆情接口应用示例
Feb 07 NodeJs
ubuntu系统下使用pm2设置nodejs开机自启动的方法
May 12 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实现懒加载的方法
2015/03/07 PHP
thinkPHP商城公告功能开发问题分析
2016/12/01 PHP
弹出模态框modal的实现方法及实例
2017/09/19 PHP
php装饰者模式简单应用案例分析
2019/10/23 PHP
PHP时间类完整代码实例
2021/02/26 PHP
JavaScript中的事件处理
2008/01/16 Javascript
js 键盘记录实现(兼容FireFox和IE)
2010/02/07 Javascript
javascript校验价格合法性实例(必须输入2位小数)
2014/05/05 Javascript
不能不知道的10个angularjs英文学习网站
2016/03/23 Javascript
详解在vue-cli项目下简单使用mockjs模拟数据
2018/10/19 Javascript
在小程序Canvas中使用measureText的方法示例
2018/10/19 Javascript
vue组件中的样式属性scoped实例详解
2018/10/30 Javascript
基于vue写一个全局Message组件的实现
2019/08/15 Javascript
JavaScript实现PC端横向轮播图
2020/02/07 Javascript
深度解读vue-resize的具体用法
2020/07/08 Javascript
JS实现京东商品分类侧边栏
2020/12/11 Javascript
[44:33]EG vs Liquid 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
初步解析Python下的多进程编程
2015/04/28 Python
一些Python中的二维数组的操作方法
2015/05/02 Python
Python基本语法经典教程
2016/03/11 Python
Request的中断和ErrorHandler实例解析
2018/02/12 Python
详解通过API管理或定制开发ECS实例
2018/09/30 Python
django项目搭建与Session使用详解
2018/10/10 Python
Python中出现IndentationError:unindent does not match any outer indentation level错误的解决方法
2020/04/18 Python
Python3+Appium安装使用教程
2019/07/05 Python
PYTHON发送邮件YAGMAIL的简单实现解析
2019/10/28 Python
印度第一网上礼品店:IGP.com
2020/02/06 全球购物
一些网络技术方面的面试题
2014/05/01 面试题
工厂保洁员岗位职责
2013/12/04 职场文书
爱情检讨书大全
2014/01/21 职场文书
安全生产月演讲稿
2014/05/09 职场文书
股东合作协议书
2014/09/12 职场文书
户籍证明模板
2014/09/28 职场文书
单独二胎证明
2015/06/24 职场文书
百日宴上的祝酒词
2015/08/10 职场文书
研究生学习计划书应该怎么写?
2019/09/10 职场文书