项目开发-若依框架

框架下载及运行

下载安装：
https://blog.csdn.net/anxiaoxiao61/article/details/122505963
https://blog.csdn.net/m0_67376124/article/details/127617498

运行：
项目后端启动：src/main/java/com/ruoyi/RuoYiApplication.java
项目前端启动：在idea中，终端运行界面中，进入ruoyi-ui文件夹中，执行npm run dev实现。

项目学习

需求修改

左侧菜单栏增加标签-项目信息

搭建过程

1 数据库内容
需要对表sys_menu 添加具体的值；
path = 路由地址， 盲猜是api中的某个文件夹
component = 表示\ruoyi-ui\src\views 中对应的xx.vue
perms = 应该和对应的controller类中的某个接口的@PreAuthorize 中的参数相同；

2 后端读取数据的表的相关内容
表对应的类：\ruoyi-common\src\main\java\com\ruoyi\common\core\domain\entity\SysMenu.java
对应的mapper：\ruoyi-system\src\main\java\com\ruoyi\system\mapper\SysMenuMapper.java
service接口：\ruoyi-system\src\main\java\com\ruoyi\system\service\ISysMenuService.java
service的实现：\ruoyi-system\src\main\java\com\ruoyi\system\service\impl\SysMenuServiceImpl.java
控制类：\ruoyi-admin\src\main\java\com\ruoyi\web\controller\system\SysMenuController.java

已完成该部分创建；
表对应的类：\ruoyi-common\src\main\java\com\ruoyi\common\core\domain\entity\CompanyInfo.java
对应的mapper：\ruoyi-system\src\main\java\com\ruoyi\system\mapper\CompanyInfoMapper.java
service的接口：\ruoyi-system\src\main\java\com\ruoyi\system\service\CompanyInfoService.java
service的实现：\ruoyi-system\src\main\java\com\ruoyi\system\service\impl\CompanyInfoServiceImpl.java

3 前端内容
vue文件：\ruoyi-ui\src\views\system\role\index.vue
js文件：\ruoyi-ui\src\api\system\role.js

已完成部分：
vue文件：\ruoyi-ui\src\views\anosub\message\index.vue
js文件：\ruoyi-ui\src\api\anosub\message.js

总体：
界面都在 \ruoyi-ui\src\views 文件夹下面。
需要在api中添加 \ruoyi-ui\src\api 文件夹下添加与path相同的文件夹；

登录之后进入的界面应该是这个了：\ruoyi-ui\src\api\menu.js
对应的vue：\ruoyi-ui\src\layout\index.vue  核心用来展示layout组件；
service接口、serviceImpl实现、


备注：
按照角色管理复刻一版；用来展示公司信息表。

问题解决

存在问题1：理解

存在问题2：已解决

mapper.xml文件中的数据表名书写错误，修改后就可以了。

存在问题3：
数据表可以正常输出，但是其中某个字段不显示。

数据库中该字段最初定义为varchar类型，代码中对应定义的类型是LocalDateTime类型，可能存在类型不匹配的问题。
判定结果为：没有将该数据读入对象中。
将数据库中create_time和update_time类型修改为timestampe和datetime类型都无法解决这个问题；

通过代码进行问题定位，发现是：数据库中的值没有被正确的赋值到对象的属性中。
问题是：
对象类中的属性被@TableField修饰，并没有实现数据库中列到对象中属性的一对一映射。
通过在mapper.xml文件中配置如下resultMap 实现一一对应关系。

发现问题4：已解决
在mapper.xml文件中，使用sql语句会存在 不等于 这个符号，输入方式是：！= 就可以实现输入。

存在问题5：已解决
判断界面中数据是否正确传递到后端，可以在vue代码中添加console.log(想要输出的内容)实现内容输出；
并通过浏览器页面=》右键=》检查=》console查看；

公司信息不能实现根据关键词查看的原因排查：
排除前端页面vue没有将数据传递；
后端调用的接口controller并没有收到数据；
则说明是前端js文件没有书写正确。

问题思考6：
springboot项目中为什么和数据库表关联的类，都需要实现Serializable接口？
序列化 (Serialization)将对象的状态信息转换为可以存储或传输的形式的过程。
分布式和并发需求：在分布式系统中，对象可能需要在网络间传输，或者在不同的服务之间进行通信。序列化使得对象可以转换为字节流，便于在网络上传输或者在进程间传递，这对于微服务架构下的数据共享尤为重要。
持久化需求：虽然直接将实体对象保存到关系型数据库（如MySQL、Oracle等）并不直接要求实体类实现Serializable接口（因为ORM框架如Hibernate、MyBatis等会处理对象到数据库记录的转换），但在某些场景下，如将对象状态保存到文件系统、缓存系统（如Redis）或数据库的BLOB字段时，序列化是必要的。
并发环境下的Session复制：在Web应用中，如果使用了session复制来支持集群环境下的会话持久化，那么session中存储的对象需要是可序列化的，以确保服务器间的session数据能够正确同步。
兼容性和版本控制：Serializable接口还涉及到一个重要的概念——serialVersionUID。这个ID用于在反序列化过程中验证类的版本，确保发送方和接收方使用的类结构兼容，有助于维护序列化的向前和向后兼容性。
框架要求和最佳实践：虽然不是所有情况下都强制要求实体类实现Serializable，但很多框架或库推荐这样做作为一种最佳实践，以保持代码的灵活性和未来的可扩展性。例如，在使用某些消息队列、分布式缓存时，序列化是基础需求。

存在问题7：已解决
nested exception is org.apache.ibatis.reflection.ReflectionException: Could not set property ‘ipend’ of ‘class com.ruoyi.common.core.domain.entity.IpsInfo’ with value ‘127.5.4.123’ Cause: org.apache.ibatis.reflection.ReflectionException: There is no setter for property named ‘ipend’ in ‘class com.ruoyi.common.core.domain.entity.IpsInfo’

mapper代码中其中某个property属性没有写对，IpInfo对象中是ipEnd，mapper中写的是ipend。

存在问题8：
将代码从一个远程库放到另一个远程库，ruo-ui文件夹中的数据，忽略了node_modules文件夹的内容。
缺失这内容会报如下错误：

PS D:\xhjwork\anosub uaid\anousubweb\ruoyi-ui> npm run dev
ruoyi@3.8.7 dev
vue-cli-service serve

'vue-cli-service' 不是内部或外部命令，也不是可运行的程序
或批处理文件。

该文件夹内容是：前端项目依赖的所有第三方库和模块。

服务器部署

问题解决

存在问题1：
描述：

GET /prod-api/captchaImage HTTP/1.1" 404 555 "
http://132.45.129.133:48080/login?redirect=%2Findex" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36 Edg/122.0.0.0" "-"  
页面所需图片不存在。

anonsub-ui的dist打包文件，测试服务器的：/usr/share/nginx/html 这里目录中的所有内容都是dist文件夹中的内容，也就是dist=html

分析及总结：

将.env.production 文件中得VUE_APP_BASE_API = 'http://ip:port/'
vue.config.js中得 target 保持原来得http://localhost:80 
然后nginx得con.d文件配置相关信息就可以正常访问。