本人敲的一个SSM整合springboot项目,测试无问题,但是前端无法访问
页面代码:
index.html
<script>
document.location.href="pages/student.html";
</script>
student.html
<!DOCTYPE html>
<html>
<head>
<!-- 页面meta -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>原神</title>
<meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
<!-- 引入样式 -->
<link rel="stylesheet" href="../plugins/elementui/index.css">
<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="../css/style.css">
</head>
<body class="hold-transition">
<div id="app">
<div class="content-header">
<h1>学生系统</h1>
</div>
<div class="app-container">
<div class="box">
<div class="filter-container">
<el-input placeholder="学生姓名" v-model="pagination.queryString" style="width: 200px;" class="filter-item"></el-input>
<el-button @click="getAll()" class="dalfBut">查询</el-button>
<el-button type="primary" class="butT" @click="handleCreate()">新建</el-button>
</div>
<el-table size="small" current-row-key="id" :data="dataList" stripe highlight-current-row>
<el-table-column type="id" label="序号"></el-table-column>
<el-table-column type="name" align="center" label="姓名"></el-table-column>
<el-table-column prop="sex" label="性别" align="center"></el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" @click="handleUpdate(scope.row)">编辑</el-button>
<el-button type="danger" size="mini" @click="handleDelete(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!-- 新增标签弹层 -->
<div class="add-form">
<el-dialog title="新增角色" :visible.sync="dialogFormVisible">
<el-form ref="dataAddForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="角色年龄" prop="age">
<el-input v-model="formData.type"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="角色名称" prop="name">
<el-input v-model="formData.name"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="描述">
<el-input v-model="formData.description" type="textarea"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible = false">取消</el-button>
<el-button type="primary" @click="handleAdd()">确定</el-button>
</div>
</el-dialog>
</div>
<!-- 编辑标签弹层 -->
<div class="add-form">
<el-dialog title="编辑检查项" :visible.sync="dialogFormVisible4Edit">
<el-form ref="dataEditForm" :model="formData" :rules="rules" label-position="right" label-width="100px">
</el-col>
<el-col :span="12">
<el-form-item label="学生姓名" prop="name">
<el-input v-model="formData.name"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="描述">
<el-input v-model="formData.description" type="textarea"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogFormVisible4Edit = false">取消</el-button>
<el-button type="primary" @click="handleEdit()">确定</el-button>
</div>
</el-dialog>
</div>
</div>
</div>
</div>
</body>
<!-- 引入组件库 -->
<script src="../js/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script src="../js/axios-0.18.0.js"></script>
<script>
var vue = new Vue({
el: '#app',
data:{
pagination: {},
dataList: [],//当前页要展示的列表数据
formData: {},//表单数据
dialogFormVisible: false,//控制表单是否可见
dialogFormVisible4Edit:false,//编辑表单是否可见
rules: {//校验规则
type: [{ required: true, message: '学生序号为必填项', trigger: 'blur' }],
name: [{ required: true, message: '学生姓名为必填项', trigger: 'blur' }]
}
},
//钩子函数,VUE对象初始化完成后自动执行
created() {
this.getAll();
},
methods: {
//列表
getAll() {
//发送ajax请求
axios.get("/student/").then((res)=>{
this.dataList = res.data.data;
});
},
//弹出添加窗口
handleCreate() {
this.dialogFormVisible = true;
this.resetField();
},
//重置表单
resetForm() {
this.formData={};
},
//添加
handleAdd () {
//ajax请求
axios.post("/jueses", this.formData).then((res) => {
console.log(res.data);
if (res.data.code == 20011) {
this.dialogFormVisible4Edit = false;
this.$message.success("添加成功!");
} else if (res.data.code == 20010) {
this.$message.error("未能添加!");
} else {
this.$message.error(res.data.msg);
}
// //操作成功
//
}).finally(()=>{
this.getAll();
});
},
//弹出编辑窗口
handleUpdate(row) {
//查询 加载 修改
// console.log(row);
axios.get("/jueses/"+row.id).then((res)=>{
//console.log(res.data.data);
if (res.data.code ==20041){
this.formData=res.data.data;
this.dialogFormVisible4Edit = true;
} else {
this.$message.error(res.data.msg);
}
});
},
//编辑
handleEdit() {
//ajax请求
axios.put("/jueses", this.formData).then((res) => {
// console.log(res.data);
if (res.data.code == 20031) {
this.dialogFormVisible4Edit = false;
this.$message.success("成功!");
} else if (res.data.code == 20030) {
this.$message.error("!");
} else {
this.$message.error(res.data.msg);
}
// //操作成功
//
}).finally(()=>{
this.getAll();
});
},
// 删除
handleDelete(row) {
//提示框
//删除
//取消删除
this.$confirm("将永久删除数据,是否继续?","提示!",{
type: 'info'
}).then(()=>{
axios.delete("/jueses/"+row.id).then((res)=>{
//console.log(res.data.data);
if (res.data.code ==20021){
this.$message.success("已删除");
} else {
this.$message.error("无法删除");
}
});
}).catch(()=>{
this.$message.info("取消删除");
}).finally(()=>{
this.getAll();
});
}
}
})
</script>
</html>
后端代码:
public class Code {
public static final Integer SAVE_OK = 20011;
public static final Integer DELETE_OK = 20021;
public static final Integer UPDATE_OK = 20031;
public static final Integer GET_OK = 20041;
public static final Integer SAVE_ERR = 20010;
public static final Integer DELETE_ERR = 20020;
public static final Integer UPDATE_ERR = 20030;
public static final Integer GET_ERR = 20040;
public static final Integer BUSINESS_ERR = 723;
public static final Integer SYS_ERR = 50001;
public static final Integer SYS_TIMEOUT_ERR = 50002;
public static final Integer SYS_UNKNOW_ERR = 59999;
}
@RestControllerAdvice
public class ProjectException {
@ExceptionHandler(SystemException.class)
public Result doSystemException( SystemException ex ){
return new Result (ex.getMessage (),null);
}
@ExceptionHandler(BusinessException.class)
public Result doBusinessException(BusinessException ex){
return new Result (null,ex.getCode (), ex.getMessage () );
}
@ExceptionHandler(Exception.class)
public Result doOtherException(Exception ex){
return new Result (Code.SYS_UNKNOW_ERR,null,"系统繁忙");
}
}
package com.mihoyo.yuanshen.yuanshenboot9_ssm.controller;
public class Result {
private Object data;
private Integer Code;
private String msg;
public Result () {
}
public Result ( Object data , Integer code ) {
this.data = data;
Code = code;
}
public Result ( Object data , Integer code , String msg ) {
this.data = data;
Code = code;
this.msg = msg;
}
public Object getData () {
return data;
}
public void setData ( Object data ) {
this.data = data;
}
public Integer getCode () {
return Code;
}
public void setCode ( Integer code ) {
Code = code;
}
public String getMsg () {
return msg;
}
public void setMsg ( String msg ) {
this.msg = msg;
}
}
@RestController
@RequestMapping("/student")
public class StudentController {
@Autowired
private StudentService studentService;
@PostMapping
public Result save ( @RequestBody Student student ) {
boolean flag = studentService.save ( student );
return new Result ( flag , flag ? Code.SAVE_OK : Code.SAVE_ERR );
}
@PutMapping
public Result update ( @RequestBody Student student ) {
boolean flag = studentService.save ( student );
return new Result ( flag , flag ? Code.UPDATE_OK : Code.UPDATE_ERR );
}
@DeleteMapping("/{id}")
public Result delete (@PathVariable Integer id ) {
boolean flag = studentService.delete ( id );
return new Result ( flag,flag ? Code.DELETE_OK:Code.DELETE_ERR );
}
@GetMapping("/{id}")
public Result getById(@PathVariable Integer id) {
Student student = studentService.getById ( id );
Integer code = student !=null ? Code.GET_OK:Code.GET_ERR;
String msg = student != null ? "" : "查询失败";
return new Result (student,code,msg);
}
public Result getAll(){
List<Student> studentList = studentService.getAll ();
Integer code = studentList != null ? Code.GET_OK : Code.GET_ERR;
String msg = studentList != null ? "" : "查询错误";
return new Result (studentList,code,msg);
}
}
@Mapper
public interface StudentDao {
@Insert ( "insert into student (id,name,age,sex) values(#{id},#{name},#{age},#{sex})" )
public int save( Student student );
@Insert ( "update into student (id,name,age,sex) values(#{id},#{name},#{age},#{sex})" )
public int update(Student student);
@Delete ( "delete from student where id = #{id}" )
public int delete(Integer id);
@Select ( "select * from student where id = #{id}" )
public Student getById(Integer id);
@Select ( "select * from student" )
public List<Student> getAll();
}
package com.mihoyo.yuanshen.yuanshenboot9_ssm.domain;
public class Student {
private Integer id;
private String name;
private Integer age;
private String sex;
@Override
public String toString () {
return "Student{" +
"id=" + id +
", name='" + name + '\'' +
", age=" + age +
", sex='" + sex + '\'' +
'}';
}
public Integer getId () {
return id;
}
public void setId ( Integer id ) {
this.id = id;
}
public String getName () {
return name;
}
public void setName ( String name ) {
this.name = name;
}
public Integer getAge () {
return age;
}
public void setAge ( Integer age ) {
this.age = age;
}
public String getSex () {
return sex;
}
public void setSex ( String sex ) {
this.sex = sex;
}
}
public class BusinessException extends RuntimeException{
private Integer code;
public Integer getCode () {
return code;
}
public void setCode ( Integer code ) {
this.code = code;
}
public void BusinessException ( Integer code ) {
this.code = code;
}
public BusinessException ( String message , Integer code ) {
super ( message );
this.code = code;
}
public BusinessException ( String message , Throwable cause , Integer code ) {
super ( message , cause );
this.code = code;
}
public BusinessException ( Throwable cause , Integer code ) {
super ( cause );
this.code = code;
}
、
}
public class SystemException extends RuntimeException{
private Integer code;
public Integer getCode () {
return code;
}
public void setCode ( Integer code ) {
this.code = code;
}
public SystemException ( Integer code ) {
this.code = code;
}
public SystemException ( String message , Integer code ) {
super ( message );
this.code = code;
}
public SystemException ( String message , Throwable cause , Integer code ) {
super ( message , cause );
this.code = code;
}
public SystemException ( Throwable cause , Integer code ) {
super ( cause );
this.code = code;
}
}
@Service
public class StudentServiceImpl implements StudentService {
@Autowired
private StudentDao studentDao;
@Override
public boolean save ( Student student ) {
return studentDao.save ( student )>0;
}
@Override
public boolean update ( Student student ) {
return studentDao.update ( student )>0;
}
@Override
public boolean delete ( Integer id ) {
return studentDao.delete ( id )>0;
}
@Override
public Student getById ( Integer id ) {
if ( id == 0 ){
throw new BusinessException ( "你他妈找茬是不是" , Code.BUSINESS_ERR );
}
return studentDao.getById ( id );
}
@Override
public List<Student> getAll () {
return studentDao.getAll ();
}
}
public interface StudentService {
public boolean save( Student student );
public boolean update(Student student);
public boolean delete(Integer id);
public Student getById(Integer id);
public List<Student> getAll();
}
@SpringBootApplication
public class Yuanshenboot9SsmApplication {
public static void main ( String[] args ) {
SpringApplication.run ( Yuanshenboot9SsmApplication.class , args );
}
}
@SpringBootTest
public class StudentServiceTest {
@Autowired
private StudentService studentService;
@Test
public void testGetById(){
Student student = studentService.getById (1);
System.out.println (student);
}
@Test
public void testGetAll(){
List<Student> all = studentService.getAll ();
System.out.println (all);
}
}
配置:
server:
port: 1040
spring:
datasource:
type: com.alibaba.druid.pool.DruidDataSource
driver-class-name: com.mysql.cj.jdbc.Driver
url: jdbc:mysql://localhost:3306/yuanshen?servierTimezone=UTC
username: root
password: 1234
数据库表
运行结果及报错内容
测试通过,但是前端无法访问后台
我想要达到的结果
前端访问后台