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

news2025/2/6 17:18:29

前言:node.js服务器动态资源处理见 http://t.csdnimg.cn/9D8WN

一、什么是node.js服务器静态资源?

静态资源服务器指的是不会被服务器的动态运行所改变或者生成的文件. 它最初在服务器运行之前是什么样子, 到服务器结束运行时, 它还是那个样子. 比如平时写的 js, css, html文件, 都可以算是静态资源。

我的静态服务器需要使用json文件作为数据存储。并进行json数据的读取与写入。

下面,我将以在服务器中实现注册、登录为例并将我已注册的用户数据写到我的user.json中。

二、服务器处理静态资源执行思路:

(1)将所有静态资源统一放入一个文件夹中做统一处理

(2)在服务器端来处理pathname从而判断url是否是我们请求的路径

如何解析和格式化url查询字符串?

 Node.js 的 querystring 模块:

1. 将字符串参数解析成对象

querystring.parse(url)

2. 将对象参数解析成字符串

 querystring.stringify(urlObject)

三、静态资源处理的判断方法:

startWith(以什么开头)、indexOf、search、includes
 

四、执行要求:

静态资源要求:完成注册、登录功能

动态资源要求:完成注册、登录、已注册的用户列表展示功能

五、执行代码:

执行结果见视频:

20240415_142226

node.js服务器静态资源处理:

(1)我们将首页、登录、注册三个html静态页面和用户列表users.html写在views这个大文件夹下。css样式和images图片放入public这个大文件夹下。创建一个data大文件夹,data下面建一个user.json文件来专门存储用户数据

简单写一下首页、注册、登录页面的html静态页面的样式。

1》index.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>
  <a href="/login">登录</a>|<a href="/regist">注册</a>|<a href="/list">用户列表</a>
</body>
</html>

2》regist.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>
  <form method="get" action="/doRegist">
    <input type="text" name="username" placeholder="用户名"><br>
    <input type="password" name="password" placeholder="密码"><br>
    <input type="submit" value="注册"><br>
  </form>
</body>
</html>

3》login.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>
  <form method="get" action="/doLogin">
    <input type="text" name="username" placeholder="用户名"><br>
    <input type="password" name="password" placeholder="密码"><br>
    <input type="submit" value="登录"><br>
  </form>
</body>
</html>

index.html 首页显示如下:

(2)测试代码:

创建一个服务器,使服务器做出响应的请求与响应(重点:对解析后的url的pathname来做出不同的if判断处理)

const http = require('http');
const fs = require('fs');
const path = require('path');
const url = require('url');
// 声明一个专门存放所有用户的变量
var users;
// 导入查询参数的模块
const querystring = require('querystring')
//创建服务器
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里
    }
})
//服务器做出请求响应
// 设置服务器的监听器来响应'request'事件。当有人向服务器发送请求时,这个事件就会被触发
server.on('request', (req, res) => {
    let objurl = url.parse(req.url); //将包含了客户端请求的完整URL(req.url)转为一个对象才能获取到它的pathname
    let pathname = objurl.pathname;  //从解析后的URL对象objurl中提取出路径名
    // 对pathname做处理
    if (pathname.startsWith('/public')) {
        // 找到当前项目文件夹,再将相对路径转为绝对路径
        let p = path.join(__dirname, pathname);
        fs.readFile(p, (err, data) => {
            if (err) {
                res.writeHead(404, { 'Content-Type': 'text/html;charset=utf-8' });
                res.end('404 Not Found');
            } 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.writeHead(404, { 'Content-Type': 'text/html;charset=utf-8' });
                res.end('404 Not Found');
            } else {
                res.end(data);
            }
        })
    } else if (pathname == '/regist') {
        let p = path.join(__dirname, 'views/regist.html');
        fs.readFile(p, (err, data) => {
            if (err) {
                res.writeHead(404, { 'Content-Type': 'text/html;charset=utf-8' });
                res.end('404 Not Found');
            } else {
                res.end(data);
            }
        })

    } else if (pathname == '/login') {
        let p = path.join(__dirname, 'views/login.html');
        fs.readFile(p, (err, data) => {
            if (err) {
                res.writeHead(404, { 'Content-Type': 'text/html;charset=utf-8' });
                res.end('404 Not Found');
            } else {
                res.end(data);
            }
        })
//已注册或已登录的情况:
    } else if (pathname == '/doRegist') {
        let query = querystring.parse(objurl.query); //将字符串参数解析成对象
        let username = query.username;
        let password = query.password;
        if (users[username]) {
            res.writeHead(500, { 'Content-Type': 'text/html;charset=utf-8' });
            res.end('用户名已存在,不能注册!');
        } else {
            //因为users里面是一个对象。所以只能属性名=值的形式。故用户名 / 密码 为属性名 = 用户名的值 / 密码的值 为属性值
            users[username] = password;
            //利用JSON.stringify(users)将users对象转为字符串重新写到文件里去
            fs.writeFile(path.join(__dirname, 'data/users.json'), JSON.stringify(users), (err) => {
                if (err) {
                    res.writeHead(502, { 'Content-Type': 'text/html;charset=utf-8' });
                    res.end('注册失败');
                } else {
                    res.writeHead(200, { 'Content-Type': 'text/html;charset=utf-8' });
                    res.end('注册成功')
                }
            })

        }

    } 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('登录成功');
        } else {
            res.writeHead(502, { 'Content-Type': 'text/html;charset=utf-8' });
            res.end('用户名或密码错误,登录失败');
        }
    } else if (pathname == '/list') {
//显示list用户列表是动态资源处理的内容。见我的下一篇博客 
    }
});
//启动服务器
server.listen(3000, '127.0.0.1', () => {
    console.log('Server is running at http://127.0.0.1:3000');
})

(3)结果显示

此时我的用户数据就显示在了我的data文件夹下的user.json上了

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

基于springboot+vue+Mysql的校园新闻网站

开发语言&#xff1a;Java框架&#xff1a;springbootJDK版本&#xff1a;JDK1.8服务器&#xff1a;tomcat7数据库&#xff1a;mysql 5.7&#xff08;一定要5.7版本&#xff09;数据库工具&#xff1a;Navicat11开发软件&#xff1a;eclipse/myeclipse/ideaMaven包&#xff1a;…

HarmonyOS实战开发-如何实现电话服务中发送短信的功能。

介绍 本示例使用ohos.telephony.sms 接口展示了电话服务中发送短信的功能。 效果预览 使用说明&#xff1a; 首页点击创建联系人&#xff0c;弹框输入联系人姓名和电话&#xff0c;点击确定按钮后&#xff0c;联系人列表中添加该联系人;点击管理&#xff0c;该按钮变成取消&…

[数据结构]——二叉树——堆的实现

1. 堆的概念及结构 如果有一个关键码的集合K { &#xff0c; &#xff0c; &#xff0c;…&#xff0c; }&#xff0c;把它的所有元素按完全二叉树的顺序存储方式存储 在一个一维数组中&#xff0c;并满足&#xff1a; < 且 < ( > 且 > ) i 0&#xff0c;1&…

如何使用OSI七层模型的思路进行Linux网络问题排障?

在运维工作中&#xff0c;我们可能经常遇到诸如服务器无法远程连接、网站无法访问等各种网络问题。此时你是否想过&#xff0c;我们常背的OSI七层模型&#xff0c;能在处理这样的实际问题中发挥什么样的作用呢&#xff1f; 基于OSI架构的方法论&#xff0c;我们可以使用自下而…

OpenHarmony轻量系统开发【5】驱动之GPIO点灯

5.1点灯例程源码 先看最简单得LED灯闪烁操作 源码结构如下&#xff1a; 第一个BUILD.gn文件内容&#xff1a; static_library("led_demo") {sources ["led_demo.c"]include_dirs ["//utils/native/lite/include","//kernel/liteos_m/c…

FL Studio v21.2.3.4004 中文永久版网盘下载(含Key.reg注册表补丁)

软件介绍 FL Studio21水果编曲软件汉化版是一款专业的音乐制作软件&#xff0c;被广泛地应用于电子音乐、hip-hop、流行乐等多种音乐类型的制作。该软件提供了丰富的音频编曲工具和音乐效果器&#xff0c;让用户可以轻松地创作出高品质的音乐作品。同时&#xff0c;这也是一款…

配置优先级标记和队列调度示例

配置优先级标记和队列调度示例 组网图形 图1 优先级标记和队列调度示例组网图 优先级标记和队列调度简介配置注意事项组网需求配置思路操作步骤配置文件 优先级标记和队列调度简介 报文进入设备之后&#xff0c;设备会根据相应的规则分配或修改报文各种优先级的值&#xff…

Spring 事务失效总结

前言 在使用spring过程中事务是被经常用的&#xff0c;如果不小心或者认识不做&#xff0c;事务可能会失效。下面列举几条 业务代码没有被Spring 容器管理 看下面图片类没有Componet 或者Service 注解。 方法不是public的 Transactional 注解只能用户public上&#xff0c…

51单片机入门_江协科技_29~30_OB记录的自学笔记_DS18B20温度传感器

29. DS18B20温度传感器 29.1. DS18B20介绍 •DS18B20是一种常见的数字温度传感器&#xff0c;其控制命令和数据都是以数字信号的方式输入输出&#xff0c;相比较于模拟温度传感器&#xff0c;具有功能强大、硬件简单、易扩展、抗干扰性强等特点 •测温范围&#xff1a;-55C 到 …

k8s的service为什么不能ping通?——所有的service都不能ping通吗

点击阅读原文 前提&#xff1a;kube-proxy使用iptables模式 Q service能不能ping通&#xff1f; A: 不能&#xff0c;因为k8s的service禁止了icmp协议 B: 不能&#xff0c;因为clusterIP是一个虚拟IP&#xff0c;只是用于配置netfilter规则&#xff0c;不会实际绑定设备&…

腾讯EdgeOne产品测评体验—Web服务全能一体化服务,主打一步到位

前言 现在网络Web攻击真的防不胜防啊&#xff0c;相信有很多独狼开发者自己建站&#xff0c;租个云服务器&#xff0c;一部署自己的服务&#xff0c;每隔一段时间内测和网站总有一个要崩。自己感觉难受不说&#xff0c;网站稍微有点要出头的时候&#xff0c;数不清的访问攻击就…

汽车车灯用肖特基二极管,选什么型号好?

肖特基二极管种类繁多&#xff0c;有低压降肖特基二极管、通用型肖特基二极管、快速恢复型肖特基二极管、高功率肖特基二极管、汽车级肖特基二极管等等&#xff0c;其中低压降肖特基二极管和汽车级肖特基二极管是二极管厂家东沃电子的核心优势产品。关于东沃电子推出的低压降肖…

FFmpeg: 自实现ijkplayer播放器--05ijkplayer–连接UI界面和ffplay.c

文章目录 ijkplayer时序图消息循环--回调函数实现播放器播放时状态转换播放停止ijkmediaPlay成员变量成员函数ijkplayer时序图 stream_open: frame_queue_init packet_queue_init init_clock 创建read_thread线程 创建video_refresh_thread线程 消息循环–回调函数实现 ui 和…

Spectral Adversarial MixUp for Few-Shot Unsupervised Domain Adaptation论文速读

文章目录 Spectral Adversarial MixUp for Few-Shot Unsupervised Domain Adaptation摘要方法Domain-Distance-Modulated Spectral Sensitivity (DoDiSS&#xff09;模块Sensitivity-Guided Spectral Adversarial Mixup (SAMix)模块 实验结果 Spectral Adversarial MixUp for F…

在线教程|低门槛部署!SUPIR 专治各种图片模糊,还能理解文本描述进行精修

家庭相册中泛黄的老照片&#xff0c;历史档案中尘封的影像资料&#xff0c;科研实验中沉淀下的图片资源…… 图像作为一种重要的信息载体&#xff0c;不仅承载了消逝的时光与故事&#xff0c;也记录着人类对历史的探索和传承。然而&#xff0c;由于早期保存条件的限制&#xf…

Go 编译构建的一些细节

Go 编译构建的一些细节 发现自己竟然没有怎么认真研究过 go 的编译构建命令。 结论前置 go run 专门用来运行命令源码文件的命令&#xff0c;一般用来运行单个文件go build 主要是用于测试编译。编译某个包或者项目&#xff0c;在当前目录下生成可执行文件go install 编译并…

(4)步态识别论文研读——用于步态识别的分层时空表示学习

论文题目Hierarchical Spatio-Temporal Representation Learning for Gait Recognition 论文地址 https://arxiv.org/abs/2307.09856 1.摘要 步态识别是一种生物特征技术&#xff0c;通过其独特的行走方式识别个体&#xff0c;适用于无约束环境&#xff0c;具有广泛的应用。…

链表OJ1——删除链表中等于给定值 val 的所有节点

题目 力扣OJ链接&#xff1a;. - 力扣&#xff08;LeetCode&#xff09; 解法 我们来看看这个题目啊&#xff0c;怎么做呢&#xff1f; 有两种解法 三指针法 我们完全可以定义三个指针来进行这个删除操作 假设我们要移除的是2 这样子就完成了 特殊情况 开头——假设我们…

一文速览铁威马TOS 6全新“文件管理”

TOS 6 Beta已经上线一段时间了&#xff0c;各位铁粉用着怎么样呢&#xff1f;今天就和大家分享&#xff0c;TOS 6全新文件管理。 为了向用户提供更流畅、更便捷的文件管理体验&#xff0c;铁威马的研发团队积极借鉴了Windows OS和Mac OS在文件管理方面的优点&#xff0c;投入巨…

系统学c#:2、基础语法(关键字、标识符、数据类型、变量、常量、字面量、运算符、类型转换)

关键字&#xff1a; 关键字是编程语言中具有特殊含义的单词或符号&#xff0c;它们通常被编程语言用于表示特定的语法结构、操作或约定。在C#中&#xff0c;关键字具有特定的语法和功能&#xff0c;用于定义语言的基本结构和规则。 以下是一些C#中常用的关键字及其功能&#xf…