在线问题反馈模块实战 (八)​: 实现图片上传功能 (上)

👨‍🎓作者：bug 菌

✏️博客：​​CSDN​​​、​​掘金​​等

💌公众号：​​猿圈奇妙屋​​

🚫特别声明：原创不易，转载请附上原文出处链接和本文声明，谢谢配合。

🙏版权声明：文章里可能部分文字或者图片来源于互联网或者百度百科，如有侵权请联系 bug 菌处理。 

一、前言🔥

       接下来的这几期，bug 菌想跟大家分享一下自己昨天刚接到一个临时的需求，热乎着呢，想分享一下自己是如何面对临时需求并制定整个开发周期，其中包括从梳理业务到创建业务表再到实现业务逻辑形成闭环再到与前端对接，其中会穿插一些业务拓展及功能性拓展，这一条龙流程在线与大家一起见证，分享给刚入门的小伙伴，希望对你们有所帮助。

环境说明：idea2019.3 + springboot2.3.1.REALSE + mybati-plus3.2.0 + mysql5.6 + jdk1.8

       若小伙伴们在批阅文章的过程中觉得文章对您有一丝丝帮助，还请别吝啬您手里的赞呀，大胆的把文章点亮👍吧，您的点赞三连(收藏⭐️+关注👨‍🎓+留言📃)就是对 bug 菌我创作道路上最好的鼓励与支持😘。时光不弃🏃🏻‍♀️，创作不停💕，加油☘️ 

二、正文🔥

        咱们这期就重点带着大家来实现反馈针对所填写的额反馈问题及附件图片一并保存，对于这个接口，逻辑还是相对的有些复杂的。为什么这么说的呢？因为这次接口对于反馈内容及图片是统一 一并调用触发的，不是单独上传某图片或者单独保存某些字段内容。对吧，肯定要保证一次请求的数据的事务性，所以这二者逻辑必须保证在一个接口中触发。

        所以这里我就来考考大家，如果这个接口让你来设计，你会怎么做？或者给我说说你对这个需求，你是分几步来梳理并实现的。如果暂时没有啥想法，没有关系啊，就由我来给大家分享下我对这个需求是如何设计并实现的吧。

1️⃣请求格式

        考虑到要保存图片，所以我这里就采用 MultipartFile 类来接收图片数据。所以自然就不能使用 application/json 的请求方式，因为 @RequestBody 是无法与 MultipartFile 类一并使用的，所以需要前端采用 form-data 表单的形式提交才行。对于 postman 也是支持该方式测试的，这里我就给大家演示一下，如果通过 postman 进行 form-data 表单式接口调用。

演示截图如下：

        如上啊，就是对于此接口，我定义出来的接口及参数入口，就先给你们亮相啦，后续我会慢慢解释。

2️⃣请求方式

        接口采用何种请求方式，Get？Post 还是 Put？等，这个要怎么考虑呢？我这还是采用最直接的请求方式，Get 请求，为什么？你们猜猜看。

@GetMapping("/save")

3️⃣请求路径

        尽量路径命名要见名知意，像这里就是需求就是【保存问题的反馈】，所以直接定义子路径为："/save"，是不是非常直接。明白人一眼就能看懂，再附上有父访问路径“/user-questions”的加持，所以这样取名往往是不会被骂且相对优雅易懂的。

@RequestMapping("/user-questions")@GetMapping("/save")

演示：完整访问该接口接口请求路径。

http://localhost:8889/review/user-questions/save

4️⃣接口入参

        入参尽量根据前端的需要出发，有哪些字段信息是需要页面表单提交，那这部分字段信息，就是你的接口方法入参。

public ResultResponse<Boolean> saveQuestion(@ApiParam("图片数组") MultipartFile[] images,                                            @ApiParam("反馈问题类型") String questionType,                                            @ApiParam("反馈问题/建议详情") String questionContent,                                            @ApiParam("反馈问题/建议所在页面"){}

5️⃣接口返回值

        需要返回给页面什么样的结果，这是你需要考虑的，是无返回值还是有返回具体？具体返回什么结构数据？

演示：我这里是直接返回一个 boolean 值。 

public ResultResponse<Boolean> saveQuestion(){}

6️⃣接口注释

        对于定义一个接口而言，每一个参数及方法作用，都得分别描述清楚，不仅方便自己查看，也是也为日后维护降低难度。

/**     * 反馈问题保存     *     * @param images          img图片数组     * @param inPage          反馈问题/建议所在页面     * @param questionContent 反馈问题/建议详情     * @param

7️⃣总结

        如上是我对一个需求接口做的全面分析剖析，先怎么样后怎么样，一步一步来，不知道你们心中所想的是不是也跟我一样实现步骤一致呢？

如下是对于该接口所定义的完整版代码：仅供参考。

/**     * 反馈问题保存     *     * @param images          img图片数组     * @param inPage          反馈问题/建议所在页面     * @param questionContent 反馈问题/建议详情     * @param    @GetMapping("/save")    @SysLog(logType = LogTypeEnum.LOG_TYPE_IMG_UPLOAD)    @ApiOperation(value = "反馈问题保存", notes = "反馈问题保存")    public ResultResponse<Boolean> saveQuestion(@ApiParam("图片数组") MultipartFile[] images,                                                @ApiParam("反馈问题类型") String questionType,                                                @ApiParam("反馈问题/建议详情") String questionContent,                                                @ApiParam("反馈问题/建议所在页面") throws IOException {        return

如果你对于该需求，你有不同的想法或者更好的建议，欢迎评论区跟我交流呀。子曰：“三人行，必有我师焉。择其善者而从之，其不善者而改之。”

 ... ...

        好啦，以上就是这期的所有内容啦，你们学废了么？如果对你有所帮助，还请不要忘记给 bug 菌[三连支持]哟。如果想获得更多的学习资源或者想和更多的技术爱好者一起交流，可以关注我的公众号『​​猿圈奇妙屋​​』，后台回复关键词领取学习资料、大厂面经、面试模板等海量资源，就等你来拿。

三、往期热文推荐🔥

        对于问题反馈模块实战开发，我完整的梳理了每一期的教学及链接地址，仅供参考：希望能对你们有所帮助。

• ​​在线问题反馈模块实战(一):梳理业务需求并创建数据库表​​

• ​​在线问题反馈模块实战(二):封装代码自动生成类文件器​​

• ​​在线问题反馈模块实战(三):自动生成所有Controller、Service、Mapper等文件​​

• ​​在线问题反馈模块实战(四):封装通用字段类​​

• ​​在线问题反馈模块实战(五):实现对通用字段内容自动填充功能​​

• ​​在线问题反馈模块实战(六):接口文档定义​​

• ​​在线问题反馈模块实战(七):安装部署swagger2​​

• ​​在线问题反馈模块实战(八):实现图片上传功能-上篇​​

• ​​在线问题反馈模块实战(九):实现图片上传功能-下篇​​

• ​​在线问题反馈模块实战(十):实现图片预览功能​​

• ​​在线问题反馈模块实战(十一):实现图片下载功能​​

• ​​在线问题反馈模块实战(十二):实现图片删除功能​​

• ​​在线问题反馈模块实战(十三):实现多参数分页查询列表​​

• ​​在线问题反馈模块实战(十四):实现在线答疑功能​​

• ​​在线问题反馈模块实战(十五):实现在线更新反馈状态功能​​

• ​​在线问题反馈模块实战(十六):实现查详情功能​​

• ​​在线问题反馈模块实战(十七):实现excel模板在线下载功能​​

• ​​在线问题反馈模块实战(十八):实现excel台账文件记录批量导入功能​​

• ​​在线问题反馈模块实战(十九):实现数据批量导出到excel文件中功能​​

• ​​在线问题反馈模块实战(二十):实现文件批量导出到zip压缩包中功能​​

• ​​在线问题反馈模块实战(二十一):完结篇​​

        如上是整整二十期内容，每一期都是干货，对于一个模块的开发，如何一点一滴打造并测试部署上线，我再说一遍，这不是演习，是实战！是实战！是实战！

        若你们觉得只是需要了解其中某个知识点或者业务的话，也不反对，你就选择其中的几期进行学习就好，反正都已经完结啦；我只希望你们能有所收获，有所成长，也就不枉我苦心每天下班后给大家总结更新。

四、文末🔥

​​《springboot零基础入门教学》​​，都是我一手打下的江山，持续更新中，希望能帮助到更多小伙伴们。

       我是 bug 菌，一名想走👣出大山改变命运的程序猿。接下来的路还很长，都等待着我们去突破、去挑战。来吧，小伙伴们，我们一起加油！未来皆可期，fighting！

        最后送大家两句我很喜欢的话，与诸君共勉！

☘️做你想做的人，没有时间限制，只要愿意，什么时候都可以 start。

🍀你能从现在开始改变，也可以一成不变，这件事，没有规矩可言，你可以活出最精彩的自己。

💌如果文章对您有所帮助，就请留下您的赞吧！(#^.^#)；

💝如果喜欢 bug 菌分享的文章，就请给 bug 菌点个关注吧！(๑′ᴗ‵๑)づ╭❤～；

💗如果对文章有任何疑问，还请文末留言或者加群吧【QQ 交流群:708072830】；

💞鉴于个人经验有限，所有观点及技术研点，如有异议，请直接回复参与讨论(请勿发表攻击言论，谢谢）；

💕版权声明：原创不易，转载请附上原文出处链接和本文声明，版权所有，盗版必究！！！谢谢。