Springcloud+Vue配置Minio使用el-update后端收不到请求以及收到为null的问题

纯小白配置minio的经验帖，用的是ruoyi框架，让遇到同样问题的朋友少走点弯路，欢迎大神指导

后端minio配置参考若依框架（RuoYi）集成minio实现文件上传、预览 - 码匠的随手分享 (ccclip.cn)

问题一：后端收不到请求

action发请求的时候，后端就是收不到，反复检查地址确实没问题，但后端就是没有任何反应

于是找到另一种方法

<el-upload
  action
  :http-request="uploadToMinio"  //script中上传图片的方法
  list-type="picture-card"
  :on-preview="handlePictureCardPreview"
  :on-success="imgSuccess"
  :on-error="imgError"
  :on-remove="imgRemove"
  :file-list="fileList"
  :class="uploadDisabled"
  :on-change="handleChange"
  >
  <i class="el-icon-plus"></i>
</el-upload>

使用 :http-request 调用script中自定义的方法，方法中引用js中的方法给后端发请求，这种方式后端可以成功收到请求

问题二：后端收到file为空

然而收到请求之后新的问题出现了

后端接收到的参数file是null，查了海量博客，排除了PostMapping的问题，发现给MultipartFile类型的参数传值必须以formData的形式，配合RequestParam

后端：

    /**
     * 自定义 Minio 服务器上传请求
     */
    @PostMapping("/uploadMinio")
    public AjaxResult uploadFileMinio(@RequestParam("image") MultipartFile file) {
        try {
            // 上传并返回新文件名称
            String fileName = FileUploadUtils.uploadMinio(file);
            AjaxResult ajax = AjaxResult.success();
            ajax.put("url", fileName);
            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());
        }
    }

前端：

uploadToMinio(data) 
{
    let formData = new FormData();
    formData.append("image", data.file);
    uploadImg(formData).then(response => {
    this.form.icon_url = response.url
    });
}

1. formData的键值和RequestParam必须保持一致

2. 注意 :http-request 默认给自定义方法传的除了文件还有其他信息，用data接收之后放在formData里面的是data.file，否则后端收到还是null

终于，后端收到图片file上传到minio并且返回了url

展示图片：

<el-table-column label="图片" align="center" prop="icon_url">
    <template slot-scope="scope">
      <img :src="(scope.row.icon_url)" class="icon">
    </template>
</el-table-column>