express中使用formidable上传图片
前端页面
/*使用bootsrap布局静态页面*/ <form class="form-horizontal form-add"> <div class="form-group"> <label class="col-xs-2 control-label">分类名称</label> <div class="col-xs-8"> <input name="classname" class="form-control" type="text" /> </div> </div> <div class="form-group"> <label class="col-xs-2 control-label">分类图片</label> <div class="col-xs-8"> <input name="classimg" class="form-control" type="file" accept="image/*" /> </div> </div> </form> js逻辑代码
/*点击添加分类使用jquery发送ajax请求*/ // js 获取form表单 let form = document.querySelector(".form-add") // 将表单中的数据通过formdata获取并传输 let formdata = new FormData(form) $.ajax({
/*api 为监听接口的地址，如：http:127.0.0.1:3000/*/ url: api + 'addclass', type: 'post', data: formdata, dataType: 'json', // 限制默认发送form方式,改为json格式传送 contentType: false, /*默认情况下，通过data选项传递进来的数据， 如果是一个对象(技术上讲只要不是字符串)， 都会处理转化成一个查询字符串， 以配合默认内容类型 “application/x-www-form-urlencoded”。 如果要发送 DOM 树信息或其它不希望转换的信息，设置为 false。*/ processData: false, success: function(res){
if(res.status == 200) {
/*这里执行请求成功的逻辑*/ } } }) nodejs处理逻辑
let path = require('path') // 引入express let express = require('express') //引入formidable模块 let formidable = require('formidable'); //引入数据库 let mysql = require('mysql') // 创建数据库连接 let connect = mysql.createConnection({
host: '127.0.0.1', //数据库服务器ip，127.0.0.1表示本机 user: 'root', password: '123', //数据库密码 database: 'shop' //数据库名 }) // 连接数据库 connect.connect() /*监听添加分类接口*/ app.get("/addclass", function(req,res){
// 获取请求的参数 // 获取传入的form表单 解析地址传入的form表单 let form = new formidable.IncomingForm(); // 设置图片上传的地址 form.uploadDir = './upload' // 保留图片后缀名 form.keepExtensions = true // 解析参数 // fields 除了上传图片的其他数据 // files 上传的文件 form.parse(req, function(err, fields, files){
// 解析上传图片的地址，获取图片名称 let filebase = path.parse(files.img.path).base // 将上传的数据存入数据库中 // ? 代表sql语句需要的参数 let sql = 'insert into goods(name, img) values(?) ' let data = [fields.name, filebase] connect.query(sql, [data], function(err, data){
if(!err) {
res.json({
status: 200, data: '' //上传成功返回的数据 }) }else {
//上传失败操作 } }) }) }) 版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/232214.html原文链接：https://javaforall.net
