在学习软件工程实务的这门课程的过程中我学习到了很多新知识,在学习新知识的同时也遇到了各种问题,如:在idea中完成一些相关代码之后生成的接口无法在前端中使用——跨域问题,对于这个问题也是困扰我许久,在经过三四天的不懈努力中我也是把这个问题解决掉,在解决问题的过程我也有了一些属于自己的心得,代码如下:
package org.example.config;
import javax.servlet.FilterChain;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.util.logging.Filter;
import java.util.logging.LogRecord;
public class CorsFilter implements Filter, CorsFilte, login {
public void doFilter(ServletRequest request, ServletResponse response, FilterChain filterChain) throws IOException,
ServletException, javax.servlet.ServletException {
//设置允许跨域访问的域名和方法
HttpServletResponse resp = (HttpServletResponse) response;
HttpServletRequest req = (HttpServletRequest) request;
resp.setHeader("Access-Control-Allow-Origin", "*");
resp.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
resp.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
//判断是否为预检请求
if ("OPTIONS".equals(req.getMethod())) {
resp.setStatus(HttpServletResponse.SC_OK);
return;
}
//执行下一个过滤器或servlet
filterChain.doFilter(request, response);
}
@Override
public boolean isLoggable(LogRecord logRecord) {
return false;
}
}
不止是因为跨域问题,在刚开始接触idea后端的时候,我对于后端代码简直就像无头苍蝇一般,四处碰壁,遇到的问题也是源源不断的飞扑过来,比如在我想要完成一个查询接口时,却找不到何种方法能够查询,查询什么?用什么来查询?根据什么的基础来查询?
可以在Mapper类中写相关联的接口类,如:
User findByUsername(String username);
Optional<User> findById(UUID id);
List<User> findAll();
findByUsername(String username) 方法接受一个用户名作为参数,并返回具有指定用户名的用户对象。这个方法用于按用户名查找用户。
findById(UUID id) 方法接受一个 UUID 标识符作为参数,并返回一个可选的用户对象。这个方法用于按照用户的唯一标识符查找用户。
findAll() 方法返回一个用户对象的列表,用于获取所有用户对象。
这些能很好的帮组你们去做一些简单的接口功能,find是通过,By是什么,后面则是接自己查询基础,findByUsername便是通过用户名来查询
不同的注解也有不同的作用,了解注解能够对你们写项目代码有很好的辅助作用
@RequestBody 是一个注解,用于Spring框架中的控制器方法参数上。
@PathVariable是一个注解,用于在Spring MVC中处理请求路径中的变量。
@ApiOperation 是一个用于在 Swagger 或 OpenAPI 文档中提供操作(API)的描述信息的注解。它可以应用于 Spring Boot 项目中的控制器方法,以便为每个操作提供详细的文档说明。
@GetMapping是一个注解,用于将HTTP GET请求映射到特定的处理程序方法上。在Spring框架中,它用于声明控制器中的处理程序方法可以用于处理GET请求。
@PostMapping 是一个注解,用于将HTTP POST请求映射到特定的处理方法(handler method)上。在Spring MVC框架中,使用@PostMapping可以方便地将POST请求映射到相应的控制器方法上。
@Temporal 是一个 JPA 注解,用于指定实体属性的持久化类型。它可以应用于日期和时间类型的属性,以指定该属性在数据库中的存储格式。
@Temporal 注解有两个选项:
TemporalType.DATE:用于表示只包含日期的属性。在数据库中,这种类型的属性将存储为日期类型。
TemporalType.TIMESTAMP:用于表示日期和时间的属性。在数据库中,这种类型的属性将存储为日期时间类型。
也是通过这门课程让我更近距离的了解到后端代码的编写过程与它艰难的生成过程,我自己也是觉得后端代码是较难的一个代码编程端,不仅仅需要认真仔细的编写,还需要上下联动的关联性,通过了自己编写自己想要的后端接口,让我更深刻的认识到代码的魅力和复杂程度。
后端的上传文件也是比较繁琐的一道编程,希望我的感悟能够很好的帮助更多人
public ApiResult upload(@RequestParam("file") MultipartFile file) {
JSONObject result = FileUtils.uploadWithRandomName(file, imgPath);
return new ApiResult(result.getBoolean(FileUtils.UPLOAD_PARAM_STATUS),
result.getString(FileUtils.UPLOAD_PARAM_MESSAGE),
result.getString(FileUtils.UPLOAD_PARAM_URL));
}
这段代码的作用是实现一个上传文件的功能。它接收一个MultipartFile类型的参数"file",该参数表示要上传的文件。然后调用FileUtils类的uploadWithRandomName方法,将文件以随机名称上传到指定的imgPath路径下。
uploadWithRandomName方法返回一个JSONObject对象,该对象包含了上传结果的各种信息,如上传状态、消息和文件URL。接着,代码将这些信息封装到一个ApiResult对象中,并通过构造函数返回给调用者。
MultipartFile类能够快速的生成一些繁琐的代码,在MultipartFile类中也有一些关于上传文件的代码布局,所有在上传文件这类的代码中可以使用MultipartFile类来进行快速封装代码
在后端编写代码的同时也需要连接数据库,这是最重要的一个,如果没有连接上数据库的话就算编程完接口也是用不了的,这是我写的数据库连接代码 ,如下:
spring:
datasource:
driver-class-name: com.mysql.cj.jdbc.Driver
url: jdbc:mysql://localhost:3306/mydb?serverTimezone=UTC
username: root
password:
driver-class-name
: 指定数据库驱动程序的类名。在这里,com.mysql.cj.jdbc.Driver
是MySQL数据库的驱动程序类。url
: 指定数据库的连接URL。在这里,jdbc:mysql://localhost:3306/mydb?serverTimezone=UTC
表示连接到本地MySQL服务器上名为mydb
的数据库,并使用UTC时区。username
: 指定连接数据库时使用的用户名。在这里是用于连接数据库的用户名。password
: 指定连接数据库时使用的密码。在这里是用于连接数据库的密码。- 在这门课程中也是需要到使用uni—app的前端技术,将一些写完的代码接口使用Postman测试完之后去前端HBX中使用
-
export default{ host:"https://1.12.223.54/", action_hot:"api/v1/blogs/", action_blogs_page:"api/v1/blogs/page", action_search :"api/v1/blogs/search/", action_read_count:"api/v1/blogs/read", actoin_del_good:"api/v1/blogs/delgood",
以上便是后端代码接口在前端HBX中的部署
再通过调用接口的方式将数据库里面的数据读取出来,如下:
gotDetail(id) {
console.log(id);
uni.navigateTo({
url: '../blogs/blogs?id=' + id,
success: res => {},
fail: () => {},
complete: () => {}
});
},
这是一个简单的接口调用方法,将数据放入一个gotDetail(id)方法中,再将gotDetail(id)方法读取显示,如:
<view v-else class="item-container" v-for="(item,index) in blogs" :key="item.id" @click="gotDetail(item.id)">
<view class="item-title">
<image :src="item.user.avatar" mode="aspectFill" class="img-head"
@click.stop="clickShowUser(item.user)"></image>
<text style="border-bottom: darkgray 1px solid;width:100%;">{{item.title}}</text>
</view>
这就是前后端的联动代码了,这也是其中的一小小部分,还有许多的知识需要我去了解和发现,对于代码编程这条道路我也会一直坚定不移的走下去
当然,一些后端写的返回数据的代码方法也是需要在前端中部署的,比如:
//1.保存所有注册的通知(包含名称,要执行的代码,观察者)
let notices = []
//2.注册通知到通知中心
/**
* @param {String} name 通知名称,不能冲突,建议写在全局文件中
* @param {Function} selector 通知对应要执行的函数,发生相应事件即可执行
* @param {Object} observer 观察者,一般就是page或component
*/
function add(name, selector, observer) {
let notice = {
name: name,
selector: selector,
observer: observer
}
notices.push(notice)
}
//3.可以移除
/**
* 移除通知,当观察者对象销毁时调用
* @param {String} name 通知名称
* @param {Object} observer 注册的观察者
*/
function remove(name, observer) {
for (let i = 0; i < notices.length; i++) {
let noti = notices[i]
if (noti.name == name && noti.observer == observer) {
notices.splice(i, 1)
return
}
}
}
//4.可以发送通知给观察者
/**
* 被观察者observer/suject发送通知
* @param {String} name 通知名称
* @param {Object} info 注册的观察者
*/
function post(name, info) {
for (let i = 0; i < notices.length; i++) {
let noti = notices[i]
if (noti.name == name) {
noti.selector(info)
}
}
}
module.exports = {
add,
remove,
post
}
以上的前端代码中都带有一些相对应的解释,相信很多朋友都能够快速的了解到,如果有朋友有用到的地方也可以根据自己的需求去修改,本文中知识提供一些简单的样式给大家参考。
代码编程复杂无比,希望我的文章能够帮助大家认识一些关于代码编程的冰山一角
以上便是我对软件工程实务这门课程的心得体会了,在我看来,我的编程水平还有待我继续提高
谢谢大家观看