vue+springboot+element实现上传功能

后台接口，string mindId 是我自己工作需要，可自行调整

  SimpleDateFormat sdf  = new SimpleDateFormat("/yyyy/MM/dd/");
    @RequestMapping(value={"/upload"},method=RequestMethod.POST)
    @ResponseBody
    public Map<String,Object> upload(MultipartFile file, HttpServletRequest req,String mindId){
        Map<String,Object> result = new HashMap<>();
        String orignName = file.getOriginalFilename();
        if(!orignName.endsWith(".jpg")){//这个地方我判断只能上传jpg格式的文件
            result.put("status","error");
            result.put("mas","文件类型不对");
            return result;
        }
        String format = sdf.format(new Date());
        String realPath = req.getServletContext().getRealPath("/")+format;
        File folder = new File(realPath);
        if(!folder.exists()){
            folder.mkdirs();
        }
        String newName = UUID.randomUUID().toString()+".jpg";
        try{
            file.transferTo(new File(folder,newName));
            String url = req.getScheme()+"://"+req.getServerName()+":"+req.getServerPort()+format+newName;
            result.put("status","success");
            result.put("url",url);
        }catch (IOException e){
            result.put("status","error");
            result.put("mas",e.getMessage());
        }
        return result;
    }

前段elemetn

  <el-upload
          action="http://192.168.1.125:8088/api/upload"
          :on-preview="handlePreview"
          accept=".jpg"
          :limit="10"
        >
          <el-button type="primary" size="small">点击上传</el-button>
          <div slot="tip" class="el-upload_tip">只能上传jpg/png文件，且不能超过500kb</div>
        </el-upload>

methods

handlePreview(file){
        window.open(file.response.url)
      },