一、静态页面:
<body>
<h1>单上传文件</h1>
<form action="/uploadFile.do" method="post" enctype="multipart/form-data">
<input type="file" name="myFile">
<button>上传</button>
</form>
<h1>多文件上传</h1>
<form action="/uploadFiles.do" method="post" enctype="multipart/form-data">
<input type="file" name="myFiles" multiple="multiple">
<button>多文件上传</button>
</form>
</body>
二、在app.js里搭建服务器并配置,设置并监听端口
//========================搭建服务器并配置=================
const express=require("express");//加载express 资源
const logger=require("morgan");//日志模块
const app=express();//执行express 全局函数,返回一个express服务器对象
const path=require("path");
//引入自己的路由模块
const route=require("./routes/indexRouter");
// 引入处理post数据的模块
const bodyParser = require("body-parser");
//---express 配置
//2.日志模块:记录每次请求信息,并在调试台看到
app.use(logger("dev"));//调用日志,配置为dev模式
//使用处理post请求的模块
app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());
// 使用自己定义的路由模块
app.use(route);
//1.设置静态资源路径
app.use(express.static(__dirname+"/public"));//__dirname 指向当前文件的根目录
app.set("port",9999);//设置端口
app.listen(9999,()=>{
console.log("服务器已启动"+app.get("port"));
});
三、配置模块
1、在config文件夹里新建一个dbpoolconfig.js(文件名自定义)页面建立数据库连接池
需要下载mysql模块:npm install mysql --save
const mysql=require("mysql");
const dbpool={
pool:{},
config:{// 创建连接池需要用到的参数
host:"localhost",//主机地址
port:"3306",//端口
user:"root",//用户名
password:"root",//密码
database:"studentsystem"// 数据库名称
},
create(){
// console.log("创建连接池");
this.pool=mysql.createPool(this.config)// 创建连接池
},
connect(sql,arr,fn){
this.pool.getConnection((err,connection)=>{
/*发起query数据库语局
* 1.SQL语局句
* 2.sql参数
* 3.回调函数,执行完sql语句后调用,把结果注入在回调函数的参数里面,做出响应*/
connection.query(sql,arr,fn);
// 释放连接
connection.release();
})
}
};
dbpool.create();
//公开配置
module.exports=dbpool;
2、在config文件夹里新建一个uploadconfig.js(文件名自定义)页面配置 文件上传模块
需要下载multer模块:npm install multer --save
const multer=require("multer"); // 引入multer模块
//文件上传模块的配置
const storage=multer.diskStorage({
destination:function (req,file,cb) {
console.log(file);
cb(null,"./public/uploads");// 保存上传的文件的路劲
},
filename:function (req,file,cb) {
// console.log(file);
let fileFormat=(file.originalname).split(".");
// 保存上传的文件的名称
cb(null,fileFormat[0]+"-"+Date.now()+"."+fileFormat[fileFormat.length-1]);
}
});
//将配置匹配给multer对象
const upload=multer({
storage:storage
});
//公开配置
module.exports=upload;
四、路由模块routes文件下indexRouter.js(文件名自定义)
const express=require("express");
const path=require("path");
// 引入路由模块
const uploadController=require("../controller/uploadController");
// 调用express对象的路由方法来获取路由对象
const router=express.Router();
// 引入处理文件上传的模块
const upload=require("../config/uploadconfig");
//=======================路由拦截=============================
// 单文件上传
router.post("/uploadFile.do",upload.single("myFile"),uploadController.uploadFile);
// 多文件上传
router.post("/uploadFiles.do",upload.array("myFiles"),uploadController.uploadFiles);
// 公开路由模块
module.exports=router;
五、controller控制层:uploadController.js(文件名自定义)
const dbpool=require("../config/dbpoolconfig"); // 引入连接池配置文件
const fileController={
uploadFile(req,resp){// 单文件上传
// console.log(req.file.filename);
let pathname="uploads/"+req.file.filename;// 路径名
let fileName=(req.file.originalname).split(".")[0]; // 文件名
dbpool.connect("insert into t_url values (?,?,?)", // mysql语句,存入数据库
[null,fileName,pathname],// 数据库中t_url表格有三列,第一列为自增,所以写null
(err,data)=>{
if(!err){
resp.send("上传成功!");
}
})
},
uploadFiles(req,resp){// 多文件上传
console.log(req);
for(let i = 0; i < req.files.length; i ++) {
let pathname = "uploads/" + req.files[i].filename;// 路径名
let fileName = (req.files[i].originalname).split(".")[0];// 文件名
dbpool.connect("insert into t_url values (?,?,?)", // mysql语句,存入数据库
[null, fileName, pathname],// 数据库中t_url表格有三列,第一列为自增,所以写null
(err, data) => {
console.log(data);
// console.log(err);
if (!err) {
if (i==req.files.length-1){
resp.send("上传成功!");
}
}
})
}
}
};
module.exports=fileController;