图片上传

ゝ一世哀愁。 2022-04-02 11:46 403阅读 0赞

文件上传流程：  
1、定义  <input type="file" name="file" accept="image/\*" onchange="uploadimage(this)" data-type="6" class="upload" style="display: none">

2、点击上传区域，触发打开选择框：

$("\#uploader").click(function()\{  
    $(".upload").click();  // 打开文件选择窗口，若点击会直接打开，则无需此代码  
\});

3、后台处理上传至图片服务器，返回图片地址，显示

4、获取图片路径，保存路径到数据库

@RequestMapping("/uploadImage")
    @ResponseBody
    public ProcessBack uploadImage(@RequestParam("upfile") MultipartFile multipartFile){
        String type = request.getParameter("type");
        PreCommonMember preCommonMember =  getPreCommonMemberByHtml();
        ProcessBack processBack = attachUnusedService.uploadImage(multipartFile, preCommonMember.getUid(),type);
        return processBack;
    }

public ProcessBack uploadImage(MultipartFile multipartFile, Long baseid, String type){
        ProcessBack processBack = new ProcessBack();
        try{
            if(StringUtil.isEmpty(type)){
                processBack.setCode(ProcessBack.FAIL_CODE);
                processBack.setMessage("type 不能为空");
                return processBack;
            }
            //上传原图&&缩率图
            Map<String,String> imageUploadMap = fastDFSUploadComponent.uploadDefaultFile(multipartFile);
        if(imageUploadMap.get(FastDFSUploadComponent.FDFS_STATE).equals(FastDFSUploadComponent.FDFS_FAIL_STATUS)){//图片上传失败
                throw new IllegalArgumentException("图片上传失败");
            }
            String url = (String) imageUploadMap.get(FastDFSUploadComponent.FDFS_URL);//原图路径
            System.out.println(url);
            //保存平台附件表
            PlatformInfoAttachUnused attachment = new PlatformInfoAttachUnused();
            attachment.setUid(baseid);//用户id
            attachment.setType(Integer.valueOf(type));//图片类型
            attachment.setIsuse(0);//是否使用1是0否
            attachment.setPno("0");//
            attachment.setAttachment(url);//图片路径
            int count = 0;
            count = baseMapper.insert(attachment);
            if(!(count > 0)){
                throw new IllegalArgumentException("附件索引记录保存失败");
            }
            processBack.setCode(ProcessBack.SUCCESS_CODE);
            processBack.setMessage("图片上传成功");
            processBack.setData(fastDFSUploadComponent.getResAccessUrl(url));
            return processBack;
        }catch(RuntimeException e){
            e.printStackTrace();
            TransactionAspectSupport.currentTransactionStatus().setRollbackOnly();//数据回滚
        }catch(Exception e){
            e.printStackTrace();
        }
        processBack.setCode(ProcessBack.FAIL_CODE);
        processBack.setMessage(ProcessBack.EXCEPTION_MESSAGE);
        return processBack;
    }

<img id='pImg' src='"+data.data+"'/>
    
    var logo = $("#pImg").attr("src");   // 这样获取图片路径更有效