若依vue3单文件上传/多文件上传/前后台代码

个人记录, 代码不完善见谅.

多文件上传前端:

多文件后端代码:

    @PostMapping("/uploads")
    public AjaxResult uploadFiles(List files) {
        try {
            // 上传文件路径
            String filePath = RuoYiConfig.getUploadPath();
            List urls = new ArrayList<>();
            List fileNames = new ArrayList<>();
            List newFileNames = new ArrayList<>();
            List originalFilenames = new ArrayList<>();
            for (MultipartFile file : files) {
                // 上传并返回新文件名称
                String fileName = FileUploadUtils.upload2(filePath, file);
                String url = serverConfig.getUrl() + fileName;
                urls.add(url);
                fileNames.add(fileName);
                newFileNames.add(FileUtils.getName(fileName));
                originalFilenames.add(file.getOriginalFilename());
            }
            AjaxResult ajax = AjaxResult.success();
            ajax.put("urls", com.ruoyi.common.utils.StringUtils.join(urls, FILE_DELIMETER));
            ajax.put("fileNames", com.ruoyi.common.utils.StringUtils.join(fileNames, FILE_DELIMETER));
            ajax.put("newFileNames", com.ruoyi.common.utils.StringUtils.join(newFileNames, FILE_DELIMETER));
            ajax.put("originalFilenames", StringUtils.join(originalFilenames, FILE_DELIMETER));
            return ajax;
        } catch (Exception e) {
            return AjaxResult.error(e.getMessage());
        }
    }

单文件前端代码:

单文件后端代码:

    @PostMapping("/upload")
    public AjaxResult uploadFile(MultipartFile file) {
        try {
            // 上传文件路径
            String filePath = RuoYiConfig.getUploadPath();
            // 上传并返回新文件名称
            String fileName = FileUploadUtils.upload2(filePath, file);
            String url = serverConfig.getUrl() + fileName;
            AjaxResult ajax = AjaxResult.success();
            ajax.put("url", url);
            ajax.put("fileName", fileName);
            ajax.put("newFileName", FileUtils.getName(fileName));
            ajax.put("originalFilename", file.getOriginalFilename());
            return ajax;
        } catch (Exception e) {
            return AjaxResult.error(e.getMessage());
        }
    }