前言
关于跨域的问题,之前一直被卡在了访问不存在上,今天无意之间翻到了一位大神的笔记,瞬间犹如醍醐灌顶一般,找到了其中的问题。
1.新建一个包,然后在包下新建一个类 (包名和类名根据自己喜欢命名)
MyCors.java
@Configuration
public class MyCors {
@Bean
public CorsFilter corsFilter(){
// 添加cors配置信息
CorsConfiguration config = new CorsConfiguration();
// 允许接收的域 ,不要写*,否则cookie无法使用
config.addAllowedOrigin("http://localhost:8081");
// 是否发送cookie消息
config.setAllowCredentials(true);
// 运行的请求方式
config.addAllowedMethod("OPTIONS");
config.addAllowedMethod("HEAD");
config.addAllowedMethod("GET");
config.addAllowedMethod("PUT");
config.addAllowedMethod("POST");
config.addAllowedMethod("DELETE");
config.addAllowedMethod("PATCH");
// 运行的请求头消息
config.addAllowedHeader("*");
// 添加映射路径,拦截一切请求
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
source.registerCorsConfiguration("/**",config);
return new CorsFilter(source);
}
}
2.在resources下的static中新增index.html,并且加入jquery.js
index.html
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>ss</title>
<script src="jquery-3.6.0.js"></script>
</head>
<body>
<input type="button" value="add" onclick="addStu()"><br>
<input type="button" value="delete" onclick="deleteStu()"><br>
<script>
function addStu(){
$.ajax({
type:'post',
url:'http://localhost:8080/stu',
data:JSON.stringify({
"name":"master",
"age":"23",
"salary":"5000.00"
}),
dataType:"json",
contentType:"application/json;charset=UTF-8",
success:function (msg){}
})
}
</script>
</body>
</html>
3.测试一手
在controller层中新建类,然后写个添加方法
运行之后,如图所示
状态码显示:200,说明成功了
在数据库看一下
数据库被添加了数据