<center>express框架基础页面导入</center>

本文介绍了如何使用Express.js设置基本的路由,包括处理GET请求和响应不同URL地址的方法。通过实例展示了如何创建一个简单的Web服务器,并监听8080端口。
/*
* @Author: Administrator
* @Date:   2019-08-20 09:31:54
* @Last Modified by:   Administrator
* @Last Modified time: 2019-08-20 09:44:50
*/

// 1. 引入express包(模块)
var express = require('express'); 

// 2. 达到一个 app 实例
// var server = http.createServer(function(req, res){res.end('hi')});
var app = express(); 

// 3. 要做出配置,针对不同的url地址进行响应 
// get 代表请求方式是 get 则满足条件,则后面的回调函数执行。
app.get('/', function (req, res) {
	
	console.log( req.url );
	console.log( req.method );

	res.end('index');

});

app.get('/about', function (req, res) {
	
	console.log( req.url );
	console.log( req.method );

	res.end('about');

});

app.get('/news', function (req, res) {
	
	console.log( req.url );
	console.log( req.method );

	res.end('news');

});

app.get('/goods/12', function (req, res) {
	
	console.log( req.url );
	console.log( req.method );

	res.end('goods-12');

});

// 1. 只能处理 get 请求
// 2. 响应的内容很有限



// 4. 监听端口
var port = 8080;
app.listen(port, function () {
	console.log( `server running at ${port}...` );
});
<!-- * @fenghua: 2401_87008233 3024798541@qq.com * @Date: 2025-09-11 19:25:30 * @LastEditors: 2401_87008233 3024798541@qq.com * @LastEditTime: 2025-09-12 20:03:47 * @FilePath: \NanChange:\Vue代码\Dao_Yun\src\vivews\user_dl_zc\deng_lu.vue * @Description: * * Copyright (c) 2025 by ${fenghua}, All Rights Reserved. --> <script setup lang="ts"> import './deng_lu.css' import { ref } from 'vue' const user = ref('164141') const password = ref('') </script> <template> <!-- 最外层框架 --> <div class="big_div"> <!-- 内容部分 --> <div class="big_div_div"> <img src="/images/dl_logo.png" alt="" width="50px" height="50px"> <!-- 账号登录/验证码登录 --> <div class="zhmm"> <span class="span1">账号登录</span> <span class="span2">验证码登录</span> </div> <div class="user"> <div> <el-input v-model="user" style="width: 100% " class="rounded-input" placeholder="请输入账号" /> </div> <div> <el-input v-model="password" style="width: 100%" class="rounded-input" type="password" placeholder="请输入密码" show-password /> </div> <div> <el-button type="primary" round style="width: 100%" class="rounded-input button">登录</el-button> </div> <div class="wangji"> <p>忘记密码</p> </div> <div class="tubiao"> <img src="/images/qq.png" alt=""> <img src="/images/wx.png" alt=""> </div> </div> </div> </div> </template> <style scoped></style> 主页面, /* eslint-disable @typescript-eslint/no-require-imports */ /* @fenghua: 2401_87008233 3024798541@qq.com @Date: 2025-09-08 19:11:03 * @LastEditors: 2401_87008233 3024798541@qq.com * @LastEditTime: 2025-09-12 19:30:13 * @FilePath: \NanChange:\Vue代码\Dao_Yun\src\server.js @Description: Copyright © 2025 by ${fenghua}, All Rights Reserved. */ const express = require('express'); const mysql = require('mysql2/promise'); // 使用promise版本 const cors = require('cors'); const app = express(); app.use(cors()); app.use(express.json()); // 解析JSON请求体 // 数据库连接池 const pool = mysql.createPool({ host: 'localhost', port: 3306, user: 'root', password: '123456', database: 'dao_yun', waitForConnections: true, connectionLimit: 10, queueLimit: 0 }); // 管理员数据API app.get('/api/user_ZC', async (req, res) => { try { const [rows] = await pool.query(` SELECT id, admin_name, login_time, status FROM user_ZC ORDER BY login_time DESC `); res.json(rows); } catch (error) { console.error('数据库查询错误:', error); res.status(500).json({ error: '数据库查询失败' }); } }); // 用户注册 app.post('/api/register', async (req, res) => { const { username, email, password } = req.body; // 基本验证 if (!username || !email || !password) { return res.status(400).json({ error: '用户名、邮箱和密码不能为空' }); } try { // 检查用户名和邮箱是否已存在 const [existingUser] = await pool.query( 'SELECT id FROM users WHERE username = ? OR email = ?', [username, email] ); if (existingUser.length > 0) { return res.status(400).json({ error: '用户名或邮箱已被注册' }); } // 实际应用中应对密码进行哈希处理 await pool.query( 'INSERT INTO users (username, email, password) VALUES (?, ?, ?)', [username, email, password] ); res.status(201).json({ message: '注册成功' }); } catch (error) { console.error('注册失败:', error); res.status(500).json({ error: '注册失败' }); } }); // 用户登录 app.post('/api/login', async (req, res) => { const { username, password } = req.body; try { const [users] = await pool.query( 'SELECT id, username, email FROM users WHERE username = ? AND password = ?', [username, password] ); if (users.length === 0) { return res.status(401).json({ error: '用户名或密码错误' }); } const user = users[0]; // 在实际应用中生成JWT token const token = 'generated_jwt_token_here'; res.json({ message: '登录成功', token, user: { id: user.id, username: user.username, email: user.email } }); } catch (error) { console.error('登录失败:', error); res.status(500).json({ error: '登录失败' }); } }); // 启动服务器 const PORT = 3000; app.listen(PORT, () => { console.log(`后端服务运行在 http://localhost:${PORT}`); }); 接口页面,请给主页面做登录功能从数据库拿数据实现。登录成功跳转至http://localhost:5173/页面
最新发布
09-13
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值