SpringBoot——【技巧】——图片上传

js部分

//保存触发函数
function pic_save() {
    var bname =  $('input[name = "bname"]').val(); //获取数据
    var cid = $('input[name = "cid"]').val(); //获取数据
    var blogo = document.getElementById('blogo').files[0];//获取图片file
    alert(bname);
    var formData=new FormData(); //创建formDate
    formData.append("file",$("#blogo")[0].files[0]); //添加数据
    formData.append("cid",cid);//也可以传递其他字段
    formData.append("bname",bname);
    $.ajax({    //ajax响应
        type:"post",
        url:"upload",
        data: formData,
        contentType: false,
        processData: false,
        success: function (result) {
            if (result.code === '200') {

                bootbox.alert("成功");
                window.location.reload();
            }
        }
    })
}

java部分

@RequestMapping("/upload")
@ResponseBody
public Result uploadFile(MultipartFile file, String bname, String cid) throws IOException {

    Result result = new Result();

    try {
        //获取文件名
        String fileName = file.getOriginalFilename();
        //保存图片的路径
        String filePath = "F:/QQReserve/myshop/src/main/resources/static/image/";
        File dest = new File(filePath + fileName);
        //保存图片
        file.transferTo(dest);
        System.out.println(fileName);
        Brand brand = new Brand();
        brand.setBname(bname);
        brand.setBlogo(fileName);
        int id = Integer.parseInt(cid);
        brand.setCid(id);
        //插入
        brandMapper.insertBrand(brand);
        result.setCode(Resource.SUCCESS);
        result.setMsg("新增成功");
    } catch (Exception e) {
        e.printStackTrace();
    }
    return result;
}

html部分

<img src="/image/${bl.blogo}"  width="160" alt="" />
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

狮子座的程序员

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值