node.js学习笔记 12express基础

/* 
    express 是node中的服务器软件
        通过express可以快速的崽node中搭建一个web服务器
    - 使用步骤:
        1.创建并初始化项目
            yarn init -y
        2.安装express
            yarn add express
        3.创建index.js 并编写代码
*/

// 引入express
const express = require('express');

// 获取服务器的实例(对象)
const app = express();

/* 
    如果需要服务器可以正常访问,则需要为服务器设置路由,路由可以根据不同的请求方式和请求地址来处理用户请求
    app.METHOD(...)
        METHOD 可以是 get 或 post ...
    中间件
        - 在express我们使用app.use来定义一个中间件
            中间件作用和路由很像,用法很像
            但是路由不检查请求类型,只检查路径

        - 和路由的区别
            1.会匹配所有请求
            2.路径设置父目录
*/
// next() 是回调函数的第三个参数,他是一个函数,调用函数后,可以触发后续的中间件
// next() 不能再响应处理完毕后使用
app.use('/', (req, res, next) => {
  console.log('收到请求...111', Date.now());
  // res.send('<h1>111</h1>');
  next(); // 放行,不管了
});
app.use('/', (req, res, next) => {
  console.log('收到请求...222', Date.now());
  // res.send('<h1>222</h1>');
  next(); // 继续放行
});
app.use('/', (req, res) => {
  console.log('收到请求...333', Date.now());
  res.send('<h1>333</h1>'); // 传出结果
});

// http://localhost:3000
// 路由的回调函数执行时,会接收到三个参数
// 第一个request,第二个response
/* 
  app.get('/', (req, res) => {
  console.log('有人访问我了');
  // 在路由中,应该做两件事
  // 读取用户请求(request)
  // req表示的是用户的请求信息,通过req可以获取用户传递数据
  console.log(req);
  // 根据用户请求返回响应(response)
  // res表示的服务器发给客户端的响应信息
  // 可以通过res来向客户端返回数据
  // status()用来设置响应状态码,但是并不发送
  // send()设置并发送响应体
  // res.sendStatus()向客户端发送响应状态码
  // res.sendStatus(404);
  // res.status(200); 
  res.send('你的请求没问题,但就是不给你看');
}); 
*/

// 启动服务器
// app.listen(端口号)用来启动服务器
// 服务器启动后,我们便可以通过3000端口来访问了
// 协议名://ip地址:端口号/路径
// http://localhost:3000
// http://127.0.0.1:3000
app.listen(3000, () => {
  console.log('服务器已经启动');
});

const express = require('express');
const path = require('node:path');

// 创建服务器的实例
const app = express();

/* 
    目前,服务器代码修改后必须要重启我们希望有一种方式,可以自动监视代码的修改,代码修改以后可以自动重启服务器

    要实现这个功能,我们需要安装一个模块 nodemon
        使用方式:
            1.全局安装
                yarn global add nodemon (不进行环境变量配置就有问题)
                yarn global remove nodemon(卸载)
                    - 通过yarn进行全局安装时,默认的yarn的目录并不在环境变量中
                    - 需要手动将路径添加到环境变量中
                npm i nodemon -g
            - 启动:
                nodemon 运行index.js
                nodemon xxx 运行指定的js
            
            2.在项目中安装
              npm i nodemon -D
              yarn add nodemon -D

              - 启动
              npx nodemon
*/

// use()中间件
/* 
  服务器中的代码,对于外部来说都是不可见的,所以我们写的html页面浏览器无法访问
  如果需要浏览器可以访问,则需要将页面所在的目录设置为静态资源目录
*/

// 设置static中间件后,浏览器访问时,会自动取public目录寻找是否有匹配的静态资源
app.use(express.static(path.resolve(__dirname, './public')));

// 配置路由
app.get('/', (req, res) => {
  /* 
    希望用户返回根目录时,可以给用户返回一个网页
  */
  res.send('这是hello路由,哈哈哈哈');
});

// 表单提交路由,简易的登录功能
app.get('/login', (req, res) => {
  // 获取用户输入的用户名和密码
  // req.query表示查询字符串中的请求参数
  // console.log(req.query.username);
  // console.log(req.query.password);

  // 验证用户输入的用户名和密码是否正确
  if (req.query.username === 'sunwukong' && req.query.password === '123123') {
    res.send('登录成功!');
  } else {
    res.send('用户名或密码错误!');
  }
  console.log('请求已经收到---');
});

// 启动服务器
app.listen(3000, () => {
  console.log('服务器已启动');
});

const express = require('express');
const app = express();
const path = require('node:path');

// 静态资源的路径
// public http://localhost:3000/
app.use(express.static(path.resolve(__dirname, 'public')));

// 添加一个路由,可以读取get请求的参数
// /login --> http://localhost:3000/login
app.get('/login', (req, res) => {
  // 获取用户信息
  // 通过req.query来查询字符串的数据
  if (req.query.username === 'admin' && req.query.password === '123123') {
    res.send('请求已提交');
  } else {
    res.send('用户名密码错误');
  }
});

// get请求发送参数的第二种方式
//  /hello/:id 表示当用户访问 /hello/xxx 时就会触发
// 在路径中以冒号命名的部分我们成为param,在get请求它可以被解析为请求参数
// param传参一般不会传递特别复杂的参数
app.get('/hello/:id', (req, res) => {
  // 约定优于配置
  // 可以通过req.params属性来获取这些参数
  console.log(req.params);
  res.send('这是hello路由');
});

// 引入解析请求体的中间件
app.use(express.urlencoded());

app.post('/login', (req, res) => {
  // 通过req.body来获取post请求的参数(请求体中的参数)
  // 默认情况下 express不会自动解析请求体,需要通过中间件来为其增加功能
  const username = req.body.username;
  const password = req.body.password;
  if (username === 'admin' && password === '123123') {
    res.send('<h1>登录成功</h1>');
  } else {
    res.send('<h1>用户名或密码错误</h1>');
  }
});

app.listen(3000, () => {
  console.log('服务器已启动');
});

const express = require('express');
const app = express();
const path = require('node:path');

// 创建一个数组来存储用户信息
const USERS = [
  {
    username: 'admin',
    password: '123123',
    nickname: '超级管理员',
  },
  {
    username: 'sunwukong',
    password: '123123',
    nickname: '齐天大圣',
  },
];

// 静态资源的路径
// public http://localhost:3000/
app.use(express.static(path.resolve(__dirname, 'public')));

// 引入解析请求体的中间件
app.use(express.urlencoded());

app.post('/login', (req, res) => {
  const username = req.body.username;
  const password = req.body.password;

  // 获取到用户的用户名和密码后,需要根据用户名去用户的数组中查找用户
  const loginUser = USERS.find(item => {
    return item.username === username && item.password === password;
  });

  if (loginUser) {
    res.send(`<h1>登录成功 ${loginUser.nickname}</h1>`);
  } else {
    res.send(`<h1>用户名或密码错误</h1>`);
  }

  //   for (const user of USERS) {
  //     if (user.username === username) {
  //       // 用户存在接着检查用户密码
  //       if (user.password === password) {
  //         // 信息正确,登录成功
  //         res.send(`<h1>登录成功 ${user.nickname}</h1>`);
  //         return
  //       }
  //     }
  //   }
  //   res.send(`<h1>用户名或密码错误</h1>`);

  //   if (username === 'admin' && password === '123123') {
  //     res.send('<h1>登录成功</h1>');
  //   } else {
  //     res.send('<h1>用户名或密码错误</h1>');
  //   }
});

app.post('/register', (req, res) => {
  // 获取用户输入的数据
  const { username, password, repwd, nickname } = req.body;
  // 验证这些数据是否正确,略...
  // 只验证用户名是否存在
  const user = USERS.find(item => {
    return item.username === username || item.nickname === nickname;
  });
  if (!user) {
    // 进入判断说明用户不存在,可以注册
    USERS.push({
      username,
      password,
      nickname,
    });
    res.send('<h1>注册成功</h1>');
  }else{
    res.send('<h1>用户名已存在</h1>');
  }
  res.send('哈哈');
});

app.listen(3000, () => {
  console.log('服务器已启动');
});