nodejs通过响应回写的方式渲染页面资源
我们一般通过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" />
    <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通过响应回写的方式渲染页面资源的更多相关文章
- SpringMVC的数据响应-回写数据
		
1.直接返回字符串 其他具体代码请访问chilianjie @RequestMapping("/report5") public String save5(HttpServletR ...
 - web端   复合控件  响应回发
		
AutoPostback="true"; 自动提交 RdiobuttonList 属性→设计→编辑项→{ Enabled 是否可用 selected 是否选中 Text ...
 - 使用client对象模型回写SharePoint列表
		
使用client对象模型回写SharePoint列表 client对象模型是一个有效的方式回写SharePoint列表. 1. 管理员身份打开VS,新建WPF应用程序SPWriteListApp,确保 ...
 - NodeBB,一个基于nodejs的响应式论坛
		
喜欢方便的同学请绕道去discuz,好吧我是nodejs的重视患者,首先你要有自己的vps或则云空间,比如9cloud,我今天用的是阿里云的VPS. 进入阿里云Ubuntu主机 .... 输入密码进入 ...
 - 镜像回源主要用于无缝迁移数据到OSS,即服务已经在自己建立的源站或者在其他云产品上运行,需要迁移到OSS上,但是又不能停止服务,此时可利用镜像回写功能实现。
		
管理回源设置_管理文件_开发指南_对象存储 OSS-阿里云 https://help.aliyun.com/document_detail/31865.html 通过回源设置,对于获取数据的请求以多种 ...
 - linux块设备的IO调度算法和回写机制
		
************************************************************************************** 參考: <Linux ...
 - Linux内核设计与实现 总结笔记(第十六章)页高速缓存和页回写
		
页高速缓存是Linux内核实现磁盘缓存.磁盘告诉缓存重要源自:第一,访问磁盘的速度要远远低于访问内存. 第二,数据一旦被访问,就很有可能在短期内再次被访问到.这种短时期内集中访问同一片数据的原理称作临 ...
 - Layui treeSelect 回写与对应选中
		
今天遇到个问题就是Layui treeSelect 的回写与特定选中,网络上居然没啥资料,有的也是不全的,于是花了点时间处理好了,这里写一下,方便以后有遇到的朋友借鉴. 一.父页面 二.Form编辑框 ...
 - JavaScript的写类方式(6)
		
时间到了2015年6月18日,ES6正式发布了,到了ES6,前面的各种模拟类写法都可以丢掉了,它带来了关键字 class,extends,super. ES6的写类方式 // 定义类 Person c ...
 
随机推荐
- CorsConfig
			
package org.linlinjava.litemall.core.config; import org.springframework.context.annotation.Bean; imp ...
 - Office 365管理员添加自定义域名
			
添加自定义域,以便Office 365允许更短.更熟悉的的电子邮件或用户ID用于服务 一.Office 365小型企业版添加自定义域名 1.使用Office 365管理员账户登陆到由世纪互联运营的Of ...
 - 如何在Windows服务器上新建一个Powershell.ps1的定时任务
			
背景: 有一些一次性的Powershell脚本,需要我们每次都手动执行一下,为了简化工作,现在我们可以使用Windows自带的计划任务,进行定时执行. 该教程是在Windows Server 2012 ...
 - 吴裕雄--天生自然 R语言开发学习:基础知识
			
1.基础数据结构 1.1 向量 # 创建向量a a <- c(1,2,3) print(a) 1.2 矩阵 #创建矩阵 mymat <- matrix(c(1:10), nrow=2, n ...
 - OpenCV 亚像素级的角点检测
			
#include "opencv2/highgui/highgui.hpp" #include "opencv2/imgproc/imgproc.hpp" #i ...
 - HttpClient简介与案例分析
			
HttpClient简介 HTTP 协议可能是现在 Internet 上使用得最多.最重要的协议了,越来越多的 Java 应用程序需要直接通过 HTTP 协议来访问网络资源.虽然在 JDK 的 jav ...
 - windows下Jmeter压测端口占用问题
			
https://blog.csdn.net/weixin_43757847/article/details/88188091 1 前情提要人脸识别项目中,云平台新增了人脸识别的校验接口.考虑到存在大量 ...
 - vue项目根目录下index.html中的id="app",与src目录下的App.vue中的id="app"为什么不会冲突
			
感谢:https://blog.csdn.net/qq_35624642/article/details/78243413 index.html <body> <div id=&qu ...
 - Dcoker跨主机容器通信之overlay
			
同样是两台服务器: 准备工作: 设置容器的主机名 consul:kv类型的存储数据库(key:value) docker01.02上: vim /etc/docker/daemon.json { &q ...
 - caffe之数据集介绍
			
数据集:http://bigdata.51cto.com/art/201702/531276.htm 计算机视觉 MNIST: 最通用的健全检查.25x25 的数据集,中心化,B&W 手写数字 ...