小而美项目总结

最新推荐文章于 2024-07-25 09:24:40 发布

20180341121

最新推荐文章于 2024-07-25 09:24:40 发布

阅读量290

点赞数 5

分类专栏：总结文章标签：前端 spring boot 后端

本文链接：https://blog.csdn.net/Mjh20180341121/article/details/122236209

版权

总结专栏收录该内容

13 篇文章 1 订阅

订阅专栏

本片目录：

1. 项目需求
2. 问题及解决方案
3. 采用的新技术点
4. 开发结果
5. 整体总结

1. 项目需求

1.1 需求分析

最近公司这边要求快速开发一个展示性的需求，来给用户看。总体的文本性需求是：开发出一个表格数据展示页面，其中要和设备端进行沟通，因为表格中展示的数据都是从设备端获取到的。还有一些特殊的前端细节需求，给了大概半个月的时间；

1.2 需求分析结果

拿到文本性需求之后，要进行一些自我的需求分析。总体来说就是用程序猿的语言来描述这些文字；

本质来说，这次的开发任务需要开发三个接口来使用。因为还要和设备端进行沟通，所以需要约定一份书面的协议书；
开发的三个接口分别是：数据接收接口、分页+条件查询接口、图片展示接口；
协议书里面约定的是各种入参的变量名及类型和格式要求；
以下是项目的整个开发思路：
1. 定协议；--- 如果没有书面性的协议约束，那么整个项目中的数据就无法接收。所以我把协议作为工程的第一步；
2. 建库；
3. 写数据接收接口并与设备进行联调；--- 写完接口之后，可以立即找设备端进行联调。因为互相沟通的环节才是最费时间的，所以这个环节要尽快；
4. 写前端接口和前端的代码；
5. 自测；
6. 上线；
在有了整体的思路之后，项目就可以开始正式开发了；

2. 问题及解决方案

2.1 分页模块

对于分页模块的理解，在之前的项目中，一直都比较模糊。这里利用这个机会好好分析了一下；
对于这个模块的理解，大家可以参考项目分页模块-逻辑分析这篇博文；

2.2 图片存储

需求：前端传递 MultipartFile 对象，后端接收之后，放到指定的目录中去；
思路：
1. 获取源文件名，目的是为了拿到文件后缀；
2. 为该文件设置一个唯一的名字；
3. 创建 File 对象，用来设置存放目录；
4. 将接收到的图片放到指定的目录中去；
代码：
	// 在这里指定图片的存放目录
       String path = System.getProperty("user.dir") + File.separator + "images"; 
	// 这里的 user.dir 是系统参数，当我们在哪里运行 .java 文件（也就是 java 项目）它就会得到哪里的路径；
	// 比如说我在 /usr/local/test/project 这个目录中执行 java -jar 命令；
	// 按上面的代码，它就会在 project 目录下创建一个 images 目录，此时的目录结构就变为了 /usr/local/test/project/images ；

	// 获取上传时的文件名
	String fileName = realMap.getOriginalFilename(); // 其中 realMap 是一个 MultipartFile 对象，也就是用户传递过来的图片；
	// 获取文件后缀
	String suffixName = fileName.substring(fileName.lastIndexOf('.'));
	// 直接定义一个 不唯一 字符串作为文件名。并去除 uuid 中的 "-"
	fileName = "real-"  + ( UUID.randomUUID() + suffixName ).replaceAll("-" , "");
	// 直接定义出 目的目录
	File targetFile = new File(path);
	if (!targetFile.exists()){
		targetFile.mkdirs();
	}
	// 通过绝对路径来保存设备上报过来的图片
	File saveFile = new File(targetFile.getAbsolutePath() , fileName); // 当代码执行到这里的时候，它会自动在 images 目录中预存一个 图片文件的空间 ，图片文件的名字就是 fileName；
	
	// 将接收到的 realMap 拷贝到我们指定的文件中去
	realMap.transferTo(saveFile); // 这里的代码会把传递过来的图片，写入到 预存的图片空间中；

2.3 图片查找

需求：前端传递过来的图片不存储到数据库中，而是存放到工程目录下。那后期是如何进行展示呢？
思路：
1. 在 springboot 中指定静态文件的存储路径，当我们发起对静态文件的访问时，项目会自动去指定的目录中去查找；
代码：
	spring.resources.static-locations=file:E:/test1/test2/images ， // 配置对于静态资源的访问路径
	// 当我们这样的配置之后，可以把需求的静态资源文件放在这个目录中，当发起对于某张图片的访问时，它就会自动去这个目录下寻找；
	// 但是也有需要注意的地方，当我们配置了这个之后， springboot 默认的静态资源访问路径会失效，所以我们需要手动把默认的给配置回来；
	spring.resources.static-locations=file:E:/test1/test2/images ， classpath:/static // 这样就可以了
实例：
	//当我们进行这样的配置之后，当前端需要某张图片时，我们只需要放回这样的一个字符串就可以了；
	   Map<String , String> urls = new TreeMap<>();
       urls.put("realMapUrl" , "/" + realMapName);
       urls.put("pointCloudUrl" , "/"  + pointCloudName);
	// 只需要把这个字符串放到 <img></img>，就可以进行正常的图片访问了；

3 采用的新技术点

以下说的新技术点，都是针对我自己来说的 哈。可能这些点对于大家来说都不是问题，但是我之前的时候接触的比较少。所以都来记录一下：
	1. 解析JSON串；     	--- 通过导入阿里的JSON工具类来解决；
	2. 图片存储；       	--- 这个是工程快速开发的需求，解决方案在上面也有涉及　哈
	3. 统一返回对象；    	--- 在SpringBoot工程中，前后端数据传输都是采用JSON串，这个时候项目经理通常会写一个统一的返回值对象用来存储结果对象；
	4. 静态资源访问路径；	---　这个是在将图片放到工程目录下时采用的，前面也有涉及　哈

4. 开发结果

最终，这个项目用时16天。开发结果也达到了负责人的要求。大家都很开心；

5. 整体总结

在这里，我们可以把项目分为两周来分析；
第一周的时候，我只完成了两件事：定协议、写数据上报接口；
那时候真的觉得自己效率好低，不过好在后期努力追赶了回来；
在这个过程中，我认为如果以后还要开发对应的项目，我一定要快速的进行需求分析、然后就是定协议；
因为之后就可以去认真的写接口了。我清晰记得 需求分析+定协议 用了5天时间（嘤嘤嘤）；
第二周的时候，前端方面遇到了很大的问题；
因为前端采用的是Vue，我从来没有学习过，写起来寸步难行；
之后就去找师兄的帮助了，最终在师兄的帮助下完成了整个项目的前端工作；