Nodejs+express后端学习笔记(1)

news2024/11/15 21:54:56

1 Node.js安装

1、下载安装包:进入官网(https://nodejs.org/en),下载左侧的稳定版。
在这里插入图片描述

2、选择安装位置,不用勾选自动安装必要工具。
其他都默认Next。
在这里插入图片描述
配置环境,具体参考本文章:

https://blog.csdn.net/WHF__/article/details/129362462

2 Node.js使用

nodejs用来开发Web服务器(后端)。本文使用Visual Studio Code进行编写和调试。

2.1 REPL环境使用

命令行状态下输入:node,就可以进入。
可以进行简单的函数编写和计算。
1、输入函数:

> function add(a,b){
	return a+b;
}
> add(1,2)

会输出3。
在这里插入图片描述

2、输入调试:

console.log("hello")

在这里插入图片描述

2.2 基本知识、程序运行方法

1、JS文件的执行方式:js单线程执行,有异步任务,同步任务。

2、模块、包与commonjs规范:

  • 内置(Nodejs自带)
  • 第三方模块(安装在node-modules文件夹中)
    • npm
    • npm install 模块名 --save
    • npm uninstall 模块名
  • 自定义(项目里独立的js文件,根据commonjs规范定义)

3、运行js代码:node ****.js

2.3 第一个js文件

1、console
新建一个文件夹,在文件夹内新建helloworld.js文件,文件内容如下:

//helloworld.js
console.log("hello, world!");

运行代码,在终端控制台输入:node helloworld.js,程序将会反馈出hello, world!

在这里插入图片描述

2、function函数定义和调用
代码如下:

console.log("hello, world!");

function add(a,b){
    return a+b;
}

console.log(add(1,2));

控制台输入输出:

PS G:\Visual Studio\Nodejs_Project\nodejs_test> node .\helloworld.js
hello, world!
3

2.4 外部js文件导入

如果要使helloworld.js文件能够引用其他js文件,需要使用require函数。
1、在同级文件夹下新建utils.js文件,文件内容如下:

function add(a,b){
    return a+b;
}
function about(){
    return "服务器";
}
const name = "utils"

module.exports = {
    add,
    about,
    msg:"你好",
    name,
}

文件内能够定义变量、函数,并通过module.exports引出,以便其他文件调用。

2、文件引入:
helloworld.js文件中,使用require函数引入utils.js文件,然后调用文件内的参数,具体代码如下:

const util = require('./utils.js');

console.log("hello, world!");

console.log(util);
console.log(util.add(1,2));
console.log(util.about());
console.log(util.msg);
console.log(util.name);

3、代码运行:

PS G:\Visual Studio\Nodejs_Project\nodejs_test> node .\helloworld.js
hello, world!
{
add: [Function: add],
about: [Function: about],
msg: ‘你好’,
name: ‘utils’
}
3
服务器
你好
utils

2.5 export导出方法

1、导出对象

module.exports = {
	add,
	about,
	msg,
	...
}

2、导出值/属性

module.exports.add = add;
module.exports.about = about;
module.exports.msg = msg;
...

3、导出

export.add = add;
export about = about;
...

2.6 fs库使用、同步异步

1、fs库使用:如果要使用fs,管理文件系统。
直接const fs = require('fs')
有同步和异步的读取方法,两者都会按照顺序执行程序,但同步方法必须阻塞程序,等到数据读取出来,再继续执行。而异步方法则不会阻塞住程序,而是另外开一个回调函数(类似于中断处理函数),先执行下方代码,等到数据读取出来,再调用回调函数。因此,同步和异步的数据的呈现顺序会出现差异。代码如下:

const fs = require('fs');       // 文件系统模块

console.log("-------------------------------")
// 异步读取,函数运行和读取到值的时间不同,读取到值之后,再调用function
console.log("a1");
fs.readFile("./text1.txt", "utf-8", function(error, res) {
    if(error){
        console.log(error);
        return;
    }
    console.log(res);
});
console.log("b1");
console.log("c1");

// 同步读取文件,读取到文件之间把值给data
console.log("-------------------------------")
console.log("a2");
const data = fs.readFileSync("./text2.txt", "utf-8");
console.log(data);
console.log("b2");
console.log("c2");

代码运行如下,可以发现异步读取的函数输出结果不是按照顺序来的,但这种方法对于网络请求来说非常重要,能够避免因为网络速度较慢造成程序长时间阻塞。

-------------------------------
a1
b1
c1
-------------------------------
a2
text2
b2
c2
text1

2、异步方法也可以使用这种方式:相当于设置一个回调函数,等文件读取完成后调用回调函数。

function readFileCompletedHandle(error, res) {
    if(error){
        console.log(error);
        return;
    }
    console.log(res);
}

fs.readFile("./text1.txt", "utf-8", readFileCompletedHandle);

2.7 更多官方库

链接:

https://nodejs.p2hp.com/api/v19/documentation/

3 express框架

3.1 初始化工程

使用命令npm init来创建新工程。里面的设置全部默认,设置完成后会出现一个package.json文件。

//package.json
{
  "name": "nodejs_test",
  "version": "1.0.0",
  "description": "",
  "main": "helloworld.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

3.2 npm

进入npm官网,查找需要的第三方函数库,比如gulp、express、mqtt等。
链接:

https://npm.p2hp.com/

3.3 引入express

在项目文件夹下,输入命令:

npm add express

然后项目中就会安装各种依赖包。
在这里插入图片描述

3.4 http构建服务器

新建http_demo.js文件,代码如下:

// http_demo.js
var http = require('http')

// 通过http模块,创建web应用
var app = http.createServer((req,res) => {
    res.writeHead(200,{"ContentType":"text/plain"});
    res.end("hello world");
});

// 通过监听端口启动
app.listen(3000,'localhost');
console.log("http://localhost:3000");

运行程序,启动服务器,终端输入:

node http_demo.js

可以看到程序输出:

http://localhost:3000

进入该网址,就可以看到:

在这里插入图片描述

如果想要停止服务器运行,使用Ctrl+C组合键关闭。

3.5 express构建服务器

express对http库进行了封装。
新建app.js文件,代码如下:

// 导入express
const express = require("express");

const app = express()

app.get('/',(req,res)=>{
    res.send('Hello World Express!');
})

app.listen(3000,()=>{
    console.log("Express app at: http://localhost:3000");
})

运行程序:

node app.js

得到输出:

Express app at: http://localhost:3000

进入网页:
在这里插入图片描述

4 express路由

4.1 get、post、put、delete四种请求

app.js代码如下:

// 导入express
const express = require("express");

const app = express()

// get请求
app.get('/',(req,res)=>{
    res.send('Get Express!');
})
// post请求
app.post('/',(req,res)=>{
    res.send('Post Express!');
})
// put请求
app.put('/',(req,res)=>{
    res.send('Put Express!');
})
// delete请求
app.delete('/',(req,res)=>{
    res.send('delete Express!');
})

app.listen(3000,()=>{
    console.log("Express app at: http://localhost:3000");
})

输入node app.js运行服务器。

浏览器能够看到Get Express!

在这里插入图片描述

下载Postman验证其他请求。

参考链接: https://blog.csdn.net/qq_37591637/article/details/88655294

输入网址:http://localhost:3000,左侧选择get、post、put、delete请求。点击Send,在底部就可以查看服务器返回的数据。
在这里插入图片描述
2、发送JSON格式数据:

//app.js
// get请求
app.get('/',(req,res)=>{
    res.send({"name":"小美","age":"18","message":"刚满十八岁~"});    // json格式数据
})

保存后重启服务器,刷新网页,可以看到:

在这里插入图片描述
postman也可以获得数据:

在这里插入图片描述
重启服务器比较麻烦,因此以下可以采用热部署。

4.2 热部署 nodemon

1、安装nodemon:
命令行输入:

npm install nodemon -d -g

-d的意思是作为依赖,可以自动添加到package.json中。
-g的意思是全局安装。

2、在package.jsonscript中修改:

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
	"start": "nodemon app.js"
  },

3、使用npm start命令来启动服务器。

在这里插入图片描述
修改并保存app.js内的数据:

// get请求
app.get('/',(req,res)=>{
    // res.send('Get Express!');
    res.send({"name":"小兰","age":"16","message":"刚满十六岁~"});    // json格式数据
})

刷新浏览器,不用重启服务器,就可以看到返回数据的变化。

在这里插入图片描述

注意:如果出现nodemon : 无法将“nodemon”项识别为 cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写,如果包括路径,请确保路径正确,然后再 试一次。问题的另外一个解决方法:

https://blog.csdn.net/yan_danfeng/article/details/109306687

4.3 路由模块化

将多个请求放置到其他文件。
新建router-demo.js,将部分app.js的代码移植到文件内,需要创建router对象,并在最后使用module.exports导出。

var express = require("express");

// 创建router对象
var router = express.Router();

// get请求
router.get('/',(req,res)=>{
    res.send({"name":"小兰","age":"16","message":"刚满十六岁~"});    // json格式数据
})
// post请求
router.post('/',(req,res)=>{
    res.send('Post Express!');
})
// put请求
router.put('/',(req,res)=>{
    res.send('Put Express!');
})
// delete请求
router.delete('/',(req,res)=>{
    res.send('delete Express!');
})

module.exports = router;

app.js修改为:

// 导入 express
const express = require("express");
const router = require("./router-demo");
const app = express();
// 绑定路由
app.use(router);

app.listen(3000,()=>{
    console.log("Express app at: http://localhost:3000");
})

重启服务器,可以看到服务依旧可以使用。

5 express中间件

5.1 修改状态Status

如果要get先返回状态(201),可以使用:

router.get('/',(req,res)=>{
    res.stauts(201).send({"name":"小兰","age":"16","message":"刚满十六岁~"});    // json格式数据
})

postman再次send以下,可以发现状态变化,从200变成201。
在这里插入图片描述

5.2 修改头部Headers

.set()可以组装头部,.end()表示一次响应的结束。

// get请求
router.get('/',(req,res)=>{
    res.set({"aHeader":"bHeader"});
    res.status(201).send({"name":"小兰","age":"16","message":"刚满十六岁~"});    // json格式数据
    res.end();
})

可以发现Headers内数据变化。
在这里插入图片描述

5.3 修改路径

如果从http://localhost:3000/user发送Get请求。
则可以修改app.js中绑定路由的参数,前面加上路径。

app.use('/user',router);

postman结果如下:依旧可以正常工作。
在这里插入图片描述

5.4 服务器读取请求

1、修改router-demo.js内get请求的函数:

var express = require("express");


// 创建router对象
var router = express.Router();

// get请求
router.get('/',(req,res)=>{
    // 请求对象
    console.log("req请求",req);

    // 响应对象
    res.set({"aHeader":"bHeader"});
    res.status(201).send({"name":"小红","age":"16","message":"刚满十六岁~"});    // json格式数据
    res.end();
})
// post请求
router.post('/',(req,res)=>{
    res.send('Post Express!');
})
// put请求
router.put('/',(req,res)=>{
    res.send('Put Express!');
})
// delete请求
router.delete('/',(req,res)=>{
    res.send('delete Express!');
})

module.exports = router;

使用浏览器/postman发送一次请求,在VS Code的终端能够看到服务器的console.log调试信息,可以发现非常的长。

req请求 <ref *2> IncomingMessage {
  _readableState: ReadableState {
    highWaterMark: 16384,
    buffer: BufferList { head: null, tail: null, length: 0 },
    length: 0,
    pipes: [],
    awaitDrainWriters: null,
    [Symbol(kState)]: 1185840
  },
  ...
  [Symbol(kHeadersCount)]: 28,
  [Symbol(kTrailers)]: null,
  [Symbol(kTrailersCount)]: 0
}

2、如果浏览器/postman发送了参数:
在这里插入图片描述
服务器读取方法如下:req.query.*****,*****是params中的Key值,输出的是value。

// get请求
router.get('/',(req,res)=>{
    // 请求对象
    console.log("req请求: ",req.query.gender);

    // 响应对象
    res.set({"gender":req.query.gender});
    res.status(201).send({"name":"小红","age":"16","message":"刚满十六岁~"});    // json格式数据
    res.end();
})

服务器控制台可以看到:

在这里插入图片描述

postman可以看到:

在这里插入图片描述

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

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

相关文章

java字节码

1. 字节码 1.1 什么是字节码&#xff1f; Java之所以可以“一次编译&#xff0c;到处运行”&#xff0c;一是因为JVM针对各种操作系统、平台都进行了定制&#xff0c;二是因为无论在什么平台&#xff0c;都可以编译生成固定格式的字节码&#xff08;.class文件&#xff09;供…

二叉树的直径,力扣

目录 题目地址&#xff1a; 题目&#xff1a; 我们直接看题解吧&#xff1a; 审题目事例提示&#xff1a; 解题方法&#xff1a; 难度分析&#xff1a; 解题方法分析&#xff1a; 解题分析&#xff1a; 补充说明&#xff1a; 代码优化&#xff1a; 题目地址&#xff1a; 543. 二…

​电脑技巧:​笔记本电脑电流声的原因和解决方案

目录 一、音频设备接口接触不良 二、笔记本电源问题 三、笔记本电脑驱动程序问题 四、音频硬件问题 五、操作系统内部电磁干扰 六、最后总结 大家在日常生活当中&#xff0c;笔记本电脑已经成为我们工作、学习和娱乐的重要工具。但有时我们在使用过程中可能会遇到一个令人…

MySQL-数据库概述

数据库相关概念&#xff1a; 数据库(DateBase)简称DB,就是一个存储数据的仓库&#xff0c;数据有组织的进行存储。 数据库分为关系型数据库简称RDBMS和非关系型数据库 关系型数据库简称RDBMS:建立在关系模型的基础上&#xff0c;由多张相互连接的二维表组成的数据库.简单来说…

项目整合积木报表-设计页面

项目整合积木报表-设计页面 <template><div><iframe id"dome" :srcsrc ></iframe></div> </template><script>export default {data(){return{src:configSrc.src"/jmreport/view/836138868821839872"}}} </…

CentOS 7.6下的HTTP隧道代理配置详解

在CentOS 7.6操作系统中&#xff0c;配置HTTP隧道代理需要一定的技术知识和经验。下面我们将详细介绍如何配置HTTP隧道代理&#xff0c;以确保网络通信的安全性和稳定性。 首先&#xff0c;我们需要了解HTTP隧道代理的基本原理。HTTP隧道代理是一种通过HTTP协议传输其他协议数…

Android 正圆

<?xml version"1.0" encoding"utf-8"?> <RelativeLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"wrap_content"android:layout_height"wrap_content"android:padding&…

遥感影像-语义分割数据集:山体滑坡数据集详细介绍及训练样本处理流程

原始数据集详情 简介&#xff1a;该遥感滑坡数据集由卫星光学图像、滑坡边界的形状文件和数字高程模型组成。该数据集中的所有图像&#xff0c;即770张滑坡图像&#xff08;红点&#xff09;和2003张非滑坡图像&#xff0c;都是从2018年5月至8月拍摄的TripleSat卫星图像中截取…

NGUI基础-三大基础控件之Sprite精灵图片

目录 Sprite是什么 如何创建Sprite 参数相关 Atlas Sprite Material Fixed Aspect Type Simple(普通模式&#xff09; Sliced(切片模式&#xff09; Tiled(平铺模式&#xff09; Filled(填充模式&#xff09; 常见的填充模式有以下几种&#xff1a; Advanced(高级…

Java IO知识点

1. Java IO IO&#xff0c;即输入&#xff08;in&#xff09;和输出&#xff08;out&#xff09;&#xff0c;指应用程序和外部设备之间的数据传递&#xff0c;常见的外部设备包括文件、管道、网络连接。Java 中是通过流处理 IO 的&#xff0c; 那么什么是流&#xff1f; 流…

AcWing 861. 二分图的最大匹配—匈牙利算法

题目链接:AcWing 861. 二分图的最大匹配 问题描述 分析 该题是一道典型的二分图匹配模板题&#xff0c;求解最大匹配数&#xff0c;可以用匈牙利算法来解决&#xff0c;下面举一个例子来说明匈牙利算法是如何运行的 以该图为例&#xff0c;其中 1可以匹配a,c 2可以匹配a,b 3…

Docker-Compose部署Redis(v7.2)哨兵模式

文章目录 一、前提准备1. 主从集群2. 文件夹结构 二、配置文件1. redis server配置文件2. redis sentinel配置文件3. docker compose文件 三、运行四、测试 环境 docker desktop for windows 4.23.0redis 7.2 一、前提准备 1. 主从集群 首先需要有一个redis主从集群&#x…

C++ 实现对战AI五子棋

个人主页&#xff1a;日刷百题 系列专栏&#xff1a;〖C/C小游戏〗〖Linux〗〖数据结构〗 〖C语言〗 &#x1f30e;欢迎各位→点赞&#x1f44d;收藏⭐️留言&#x1f4dd; ​ ​ 前言&#xff1a; 为了能够快速上手一门语言&#xff0c;我们往往在学习了基本语法后&#x…

【自学笔记】01Java基础-09Java关键字详解

介绍java&#xff08;基于java11&#xff09;中所有关键字&#xff0c;以及主要重要的关键字详解。 1 Java 11中的关键字&#xff1a; 1.1 类型声明与变量定义 boolean&#xff1a;声明布尔类型变量&#xff0c;只有两个可能值 true 或 false。byte&#xff1a;声明一个8位有…

[UUCTF 2022 新生赛]ez_rce

[UUCTF 2022 新生赛]ez_rce wp 在做这道题时&#xff0c;我参考了这篇博客&#xff1a; https://www.cnblogs.com/bkofyZ/p/17594549.html 认识到了自己的一些不足。 题目代码如下&#xff1a; <?php ## 放弃把&#xff0c;小伙子&#xff0c;你真的不会RCE,何必在此纠…

实验笔记之——基于COLMAP的Instant-NGP与3D Gaussian Splatting的对比

之前博客进行了COLMAP在服务器下的测试 实验笔记之——Linux实现COLMAP-CSDN博客文章浏览阅读794次&#xff0c;点赞24次&#xff0c;收藏6次。学习笔记之——NeRF SLAM&#xff08;基于神经辐射场的SLAM&#xff09;-CSDN博客NeRF 所做的任务是 Novel View Synthesis&#xf…

静态网页设计——个人兴致小屋(HTML+CSS+JavaScript)

前言 使用技术&#xff1a;HTMLCSSJS 主要内容&#xff1a;对个人兴致的一些介绍&#xff0c;画风优美。 主要内容 1、首页 首页是一个优美的背景加一句欢迎来到xxx的兴致小屋&#xff0c;可将XXX改成自己。点击确定可以跳到主页。 部分代码&#xff1a; <body><…

接口自动化-allure测试报告

学习目标&#xff1a; 1、测试报告的作用 2、allure的安装 3、allure的基本使用 4、allure的高级使用 学习内容&#xff1a; 1、测试报告的作用 自动化接口的结果呈现虽然可以通过日志文件去查看用例的成功或者失败&#xff0c;但是这样的结果就是不美观&#xff0c;不能…

外包干了3个多月,技术退步明显。。。。。

先说一下自己的情况&#xff0c;本科生生&#xff0c;19年通过校招进入广州某软件公司&#xff0c;干了接近4年的功能测试&#xff0c;今年年初&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落!而我已经在一个企业干了四年的功能测…

阿里云大模型「让照片跳舞」刷屏朋友圈,有哪些信息值得关注?

介绍 大家好&#xff0c;我分享聊聊阿里通义千问APP中全民舞王功能。 网络热舞结合AI视频&#xff0c;这是以后不用学习跳舞&#xff1f; 可以尝试下效果&#xff0c;一张图片生成视频。 APP快速使用 搜索下载通义千问APP 打开APP&#xff0c;选中一张照片来跳舞。 这里…