node.js服务器动态资源处理

一、node.js服务器动态资源处理与静态资源处理的区别?

静态与动态服务器主要区别于是否读取数据库,若然在数据库中的资料处理中将数据转换成可取用格式的结构,也就是说把对象转化为可传输的字节序列过程称为序列化,反之则为反序列化。

简单来说,它比起静态资源较复杂,因为它会随用户不同、响应内容不同而不断产生变化

二、什么是动态资源处理?

以JSON与JS为例,JSON.stringify()对数据序列化,JSON.parse()对数据反序列化。动态处理也就是对数据进行重新排序来读写数据库,读取反序列化,写入序列化。

三、处理动态资源的方法?

将页面内容动态化。使用到第三方模块——>模板引擎  去动态将我的数据嵌入到我的网页中去。

什么是模板引擎?见 http://t.csdnimg.cn/lzedW

四、代码示例。

(1)我们将首页、登录、注册三个html静态页面和用户列表users.html写在views这个大文件夹下。css样式和images图片放入public这个大文件夹下。创建一个data大文件夹,data下面建一个user.json文件来专门存储用户数据
简单写一下首页、注册、登录页面的html静态页面的样式。此处省略。具体见我上篇博客见 http://t.csdnimg.cn/zXWW7

动态资源处理具体表现就是我的用户列表渲染功能(users.html)和我的不同错误提示功能(404.html)。

用户列表渲染功能可以将我的user.json里面注册成功的用户数据渲染到我的服务器用户列表页面

users.html 用户列表:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>用户列表</title><link rel="stylesheet" href="../public/css/main.css">
</head>
<body><h1>用户列表</h1><img src="../public/images/01.png" alt=""><br><ul><!-- 循环li --><% for(let username in users){ %><li><!-- 取出属性名和密码这个属性值,放入li里面 --><%=username %> : <%=users[username] %></li><% } %></ul>
</body>
</html>

404.html  不同错误提示:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>404</title>
</head>
<style>body {background-color:pink;}
</style>
<body><h1><!-- 定义模板 --><%= msg %></h1>
</body>
</html>

(2)在我的测试代码的终端 npm install underscore -save安装underscore渲染模板引擎

(3) 测试代码如下:

const http = require('http');
const fs = require('fs');
const path = require('path');
const url = require('url');
// 声明一个专门存放所有用户的变量
var users;
// 导入查询参数的模块
const querystring = require('querystring');
// 导入underscore渲染模板
const _ =require('underscore');
//使用underscore渲染模板
function render(data){// 读取模板内容let temp=fs.readFileSync(path.join(__dirname,'views/404.html'));// 获取渲染函数let compiled=_.template(temp.toString());// 渲染模板return compiled(data); 
}
//创建服务器
const server = http.createServer();
//读取文件。读取user.json存放用户数据的文件
fs.readFile(path.join(__dirname, 'data/users.json'), (err, data) => {if (err) {users = {};} else {users = JSON.parse(data.toString()); //如果读取正确就将读到的内容转换为一个对象存到users里}
})
//服务器做出请求响应
server.on('request', (req, res) => {let objurl = url.parse(req.url); //将url转为一个对象才能获取到它的pathnamelet pathname = objurl.pathname;// 对pathname做处理if (pathname.startsWith('/public')) {// 找到当前项目文件夹,再将相对路径转为绝对路径let p = path.join(__dirname, pathname);fs.readFile(p, (err, data) => {if (err) {res.end(render({msg:'访问的文件不存在'})); //可以使用中文,因为现在是html页面去显示的} else {res.end(data);}})} else if (pathname == '/' || pathname == '/home') {let p = path.join(__dirname, 'views/index.html');fs.readFile(p, (err, data) => {if (err) {res.end(render({msg:'访问的文件不存在'}));} else {res.end(data);}})} else if (pathname == '/regist') { //建一个文件夹data专门来储存数据 里面建一个users.json的文件let p = path.join(__dirname, 'views/regist.html');fs.readFile(p, (err, data) => {if (err) {res.end(render({msg:'访问的文件不存在'}));} else {res.end(data);}})} else if (pathname == '/login') {let p = path.join(__dirname, 'views/login.html');fs.readFile(p, (err, data) => {if (err) {res.end(render({msg:'访问的文件不存在'}));} else {res.end(data);}})} else if (pathname == '/doRegist') {// Node.js 的 querystring 模块用于解析和格式化 URL 查询字符串:// 1. 将字符串参数解析成对象// querystring.parse(url)// 2. 将对象参数解析成字符串// querystring.stringify(urlObject)let query = querystring.parse(objurl.query);let username = query.username;let password = query.password;if (users[username]) {res.end(render({msg:'用户名已存在,不能注册!'}));} else {//因为users里面是一个对象。所以只能属性名=值的形式。故属性名 = 密码(密码相当于这个属性名对应的属性值)users[username] = password;//利用JSON.stringify(users)将users对象转为字符串重新写到文件里去fs.writeFile(path.join(__dirname, 'data/users.json'), JSON.stringify(users), (err) => {if (err) {res.end(render({msg:'注册失败'}));} else {res.end(render({msg:'注册成功'}));}})}} else if (pathname == '/doLogin') {let query = querystring.parse(objurl.query);let username = query.username;let password = query.password;// 判断users的用户名和密码有无if (users[username] && users[username] == password) { //用户名 && 密码res.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });res.end(render({msg:'登录成功'}));} else {res.writeHead(502, { 'Content-Type': 'text/html;charset=utf-8' });res.end(render({msg:'用户名或密码错误,登录失败'}));}} else if (pathname == '/list') {let p=path.join(__dirname,'views/users.html');fs.readFile(p,(err,data)=>{if(err){res.end(render({msg:'访问的文件不存在'}));}else{//获得渲染函数 let compiled=_.template(data.toString()); // 调用渲染函数来生成html内容let html=compiled({users:users}); //我们在模板里取的是users的属性,所以不能简写成users,而是users:usersres.end(html);}})}
});server.listen(3000, '127.0.0.1', () => {console.log('Server is running at http://127.0.0.1:3000');
})

(4)结果显示

4-1》当我的用户数据已被注册时:

动态显示我的404.html页面

4-2》我完成用户注册时,我点击用户列表,显示结果如下:

(5)综上所述,相比我的静态资源处理而言,我的动态资源处理就相对效率较高,对于不同的错误信息,我可以直接使用我的404.html模板,直接在我的运行代码中显示 res.end(render({msg:'错误内容'})); 并且我可以直接使用用户数据模板user.html使用<% %> 执行javascript代码。可以直接在我的服务器端页面展示我的所有成功注册的用户数据。化繁为简。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/312636.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SiLM5350系列带米勒钳位的单通道隔离驱动器 助力汽车与工业应用实现稳定与高效的解决方案

带米勒钳位的隔离驱动SiLM5350系列 单通道 30V&#xff0c;10A 带米勒钳位的隔离驱动 具有驱动电流更大、传输延时更低、抗干扰能力更强、封装体积更小等优势, 为提高电源转换效率、安全性和可靠性提供理想之选。 SiLM5350系列产品描述&#xff1a; SiLM5350系列是单通道隔离驱…

TLS v1.3 导致JetBrains IDE jdk.internal.net.http.common CPU占用高

开发环境 GoLand版本&#xff1a;2022.3.4 问题原因 JDK 中的 TLS v1.3 实现引起 解决办法 使用 SOCKS 代理代替HTTP代理 禁用 Space 和 Code With Me 插件 禁用 TLS v1.3&#xff0c;参考&#xff1a;https://stackoverflow.com/questions/54485755/java-11-httpclient-…

IEDA 的各种常用插件汇总

目录 IEDA 的各种常用插件汇总1、 Alibaba Java Coding Guidelines2、Translation3、Rainbow Brackets4、MyBatisX5、MyBatis Log Free6、Lombok7、Gitee IEDA 的各种常用插件汇总 1、 Alibaba Java Coding Guidelines 作用&#xff1a;阿里巴巴代码规范检查插件&#xff0c;…

基于小程序实现的4s店管理系统

作者主页&#xff1a;Java码库 主营内容&#xff1a;SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、小程序、安卓app等设计与开发。 收藏点赞不迷路 关注作者有好处 文末获取源码 技术选型 【后端】&#xff1a;Java 【框架】&#xff1a;ssm 【…

vs配置opencv运行时“发生生成错误,是否继续并运行上次的成功生成”BUG解决办法

vs“发生生成错误&#xff0c;是否继续并运行上次的成功生成” 新手在用vs配置opencv时遇到这个错误时&#xff0c;容易无从下手解决。博主亲身经历很有可能是release/debug模式和配置文件不符的问题。 在配置【链接器】→【输入】→【附加依赖项】环节&#xff0c;编辑查看选择…

论文笔记:The Expressive Power of Transformers with Chain of Thought

ICLR 2024 reviewer 评分 6888【但是chair 很不喜欢】 1 intro 之前的研究表明&#xff0c;即使是具有理想参数的标准Transformer&#xff0c;也无法完美解决许多大规模的顺序推理问题&#xff0c;如模拟有限状态机、判断图中的节点是否相连&#xff0c;或解决矩阵等式问题 这…

解决jenkins运行sh报process apparently never started in XXX

个人记录 问题 process apparently never started in /var/jenkins_home/workspace/ks-springboot_mastertmp/durable-bbfe5f99(running Jenkins temporarily with -Dorg.jenkinsci.plugins.durabletask.BourneShellScript.LAUNCH_DIAGNOSTICStrue might make the problem cl…

突破界限 千视将在 NAB 2024 展会上展示领先的 AV over IP 技术

突破界限&#xff01;千视将在 NAB 2024 展会上展示领先的 AV over IP技术 作为AV over IP领域的先驱者&#xff0c;Kiloview将于2024年4月14日至17日在NAB展会&#xff08;展台号&#xff1a;SU6029&#xff09;隆重登场&#xff0c;展示我们领先业界的AV over IP产品、解决方…

你要的fiddler快捷键全部在这里了,学最全的快捷键,做最快的IT程序员

一、常用三个快捷键 ctrlX :清空所有记录 CtrlF&#xff1a;查找 F12&#xff1a;启动或者停止抓包 使用 QuickExec Fiddler2 成了网页调试必备的工具&#xff0c;抓包看数据。Fiddler2自带命令行控制。 fiddler 命令行快捷键&#xff1a;ctrl q &#xff0c;然后 输入 help…

C++从入门到精通——const与取地址重载

const与取地址重载 前言一、const正常用法const成员函数问题const对象可以调用非const成员函数吗非const对象可以调用const成员函数吗const成员函数内可以调用其它的非const成员函数吗非const成员函数内可以调用其它的const成员函数吗总结 二、取地址及const取地址操作符重载概…

ubuntu 更改 ssh 默认端口 22 以加固安全

出于加固安全考虑&#xff0c;一般公司会禁用 ssh 的 22 端口号&#xff0c;因此我们需要改为其他端口。 1、ssh 命令行登录 进入台式机&#xff0c;修改 /etc/ssh/sshd_config 文件中的 Port 配置行&#xff0c;将 22 改为 8022&#xff0c;保存修改后&#xff0c;重启 ssh 服…

c++的学习之路:24、 二叉搜索树概念

摘要 本章主要是讲一下二叉搜索树的实现 目录 摘要 一、二叉搜索树概念 二、 二叉搜索树操作 1、二叉搜索树的查找 2、二叉搜索树的插入 3、二叉搜索树的删除 三、二叉搜索树的实现 1、插入 2、中序遍历 3、删除 4、查找 四、二叉搜索树的递归实现 1、插入 2、删…

LLM推理框架Triton Inference Server学习笔记(二): Triton模型部署流程(stey by stey)

官方文档查阅: TritonInferenceServer文档 1. 写在前面 上一篇文章对triton inference server进行了一个整体的介绍&#xff0c;解答了三个经典问题what, why, how。 这篇文章就开始转入实践&#xff0c; 从实践的角度整理Triton模型部署的全流程&#xff0c; 如果我有一个训…

华为 2024 届实习招聘——硬件-电源机试题(四套)

华为 2024 届实习招聘——硬件-电源机试题&#xff08;四套&#xff09; 部分题目分享&#xff0c;完整版带答案(有答案&#xff0c;答案非官方&#xff0c;未仔细校正&#xff0c;仅供参考&#xff09;&#xff08;共四套&#xff09; 获取&#xff08;WX:didadidadidida313&…

AcWing 796. 子矩阵的和——算法基础课题解

AcWing 796. 子矩阵的和 题目描述 输入一个 n 行 m 列的整数矩阵&#xff0c;再输入 q 个询问&#xff0c;每个询问包含四个整数 x1,y1,x2,y2&#xff0c;表示一个子矩阵的左上角坐标和右下角坐标。 对于每个询问输出子矩阵中所有数的和。 输入格式 第一行包含三个整数 n&…

Easy GIS .NET GMap.Net

Easy GIS .NET & GMap.Net .NET 环境下非常简单的GIS地图开发库。 Easy GIS .NET 一个简单的GIS 桌面应用程序&#xff0c;实现了地图瓦片加载、shapefile文件和csv文件加载渲染、地图坐标系统设置及转换等等基本功能&#xff0c;非常简单易用。 Easy GIS .NET is an o…

Linux CentOS 安装 MySQL 服务教程

Linux CentOS 安装 MySQL 服务教程 1. 查看系统和GNU C库(glibc)版本信息 1.1 查询机器 glibc 版本信息 glibc&#xff0c;全名GNU C Library&#xff0c;是大多数Linux发行版中使用的C库&#xff0c;为系统和应用程序提供核心的API接口。在Linux系统中&#xff0c;特别是在…

基于Springboot+Vue+Spring-Security+高德地图API的校园出行管理系统

1介绍 1.1编写目的 明确系统功能与操作流程&#xff0c;说明书提供了详细的系统功能描述和操作指南&#xff0c;使得用户能够了解如何通过系统申请请假、审批流程以及如何管理和监控请假记录等。 1.2文档范围 该文档的目的是解决整个项目系统中“做什么”的问题。对于开发技…

Mybatis-plus中的分页操作

Mybatis-plus中的分页操作 1.导入Mybatis-plus依赖2.创建mybatis配置类3.参数 1.导入Mybatis-plus依赖 因为是一个springboot项目&#xff0c;其中的pom.xml文件内容如下&#xff1a; <?xml version"1.0" encoding"UTF-8"?> <project xmlns&q…

YOLOv8 测试 5:Linux 中 Docker 部署 YOLOv8,Python 封装 API 接口,base64 图片处理

一、前言 记录时间 [2024-4-14] 系列文章简摘&#xff1a; Docker 学习笔记&#xff08;二&#xff09;&#xff1a;在 Linux 中部署 Docker&#xff08;Centos7 下安装 docker、环境配置&#xff0c;以及镜像简单使用&#xff09; API 接口简单使用&#xff08;二&#xff09;…