NodeJs之图片上传

NODEJS后台

    const express = require('express');
    const multer = require('multer');
    const fs = require('fs');
    const pathLib = require('path');
    let server = express();// 定义上传的文件的路径
    let multerObj = multer({dest : './www/upload/'});
    server.listen(8081);
    server.use(multerObj.any());
    server.post('/reg', (req, res) =>{    // 上传的文件
        res.setHeader("Access-Control-Allow-Origin","*");
        console.log(req.body);
        console.log(req.files[0]);
        //新文件名  名 获取原始文件的扩展名
        let newName = req.files[0].path + pathLib.extname(req.files[0].originalname);
        //let newName = req.files[0].originalname;
        //重命名
        fs.rename(req.files[0].path, newName, (err) =>{
            if(err){
                console.log('error');
                res.send('lose');
            } else {
                console.log('success');
                res.send('success');
            }
        });
    });

前端功能

    <script>
    $(function(){
        //图片预览
        $("[type=file]").on("change", function(){

            var read = new FileReader();
            read.readAsDataURL(this.files[0]);
            read.onload = function(){
                $("img").attr("src", read.result);
            }
        })
        //提交
        $("form").on("submit", function(){
            var formdata = new FormData();
            formdata.append("uname", $('[name="uname"]').val());
            formdata.append("upwd", $('[name="upwd"]').val());
            formdata.append("file",$("[type=file]")[0].files[0]);
            $.ajax({
                type : "post",
                url : "http://127.0.0.1:8081/reg",
                data :formdata,// $("form").serialize(),
                dataType : "json",
                processData : false,
                contentType:false,
                success : function(res){
                    console.log(res);
                }
            })

            return false;
        })

    })
</script>