新建一个登录页面

page下新增Login.vue。
src下新建mhttp文件夹，再建login.ts，用来写登录接口。
运行的时候需要先把ts转化为js，运行命令：tsc login.ts，node login.js。
这里不出意外的出了意外----跨域。查了几种方法，都贴一下：
1、请求头设置Access-Control-Allow-Origin: '*'
2、vue.config.ts设置代理
server: {
proxy: {
'/api': {
target: 'http://localhost:3000', // 后端服务器的URL
changeOrigin: true, // 是否改变源地址
rewrite: (path) => path.replace(/^/api/, '') // 重写路径，移除/api前缀
}
}
},
3、引入依赖cors，npm i cors，nodejs后端引入cors
import cors from 'cors'
app.use(cors());

login.js完整代码
// var express = require('express');
import express from 'express'
import cors from 'cors'

var app = express();
var port = 3000;
app.use(cors());
app.use(express.json());
app.use(express.urlencoded({ extended: true }));
// 假设有一个简单的用户数据库（在实际应用中，你应该使用数据库来存储用户信息）
var users = [
{ name: 'admin', password: '123' },
{ name: 'user', password: '000' }
];
// 登录接口
app.post('/api/login', function (req, res) {
var _a = req.body, name = _a.name, password = _a.password;
// 检查请求体中是否包含用户名和密码
if (!name || !password) {
return res.status(400).send('用户名和密码是必填项');
}
// 验证用户名和密码
var user = users.find(function (u) { return u.name === name && u.password === password; });
if (user) {
// 登录成功，返回用户信息和成功状态
res.status(200).send({ message: '登录成功', user: user });
}
else {
// 登录失败，返回错误消息
res.status(401).send('用户名或密码错误');
}
});
// 启动服务器
app.listen(port, () => {
console.log(Server is running on http://localhost:${port});
});
Login.vue新增代码
import {
useRouter
} from 'vue-router'; 引入路由
const router = useRouter();

function navigateToList() {
    router.push('/list'); //登陆成功跳转list页面
}

const {
name,
password
} = parentForm.MFormField
http.post('/api/login', {
name,
password
}).then(res => {
navigateToList()
}).catch(err => {
ElMessage({
message: err,
type: 'warning',
})
})

到这里，一个后端管理系统的模板就成型了。

一般情况下cors要配置白名单
// 配置CORS白名单
const whitelist = ['http://example1.com', 'http://example2.com'];
const corsOptions = {
origin: function (origin, callback) {
if (whitelist.indexOf(origin) !== -1) {
callback(null, true);
} else {
callback(new Error('Not allowed by CORS'));
}
}
};

app.use(cors(corsOptions));