【Java闭关修炼】SpringBoot项目-贪吃蛇对战小游戏-创建个人中心页面（上）

  • 创建一个user表
  • 创建pojo.bot
  • 实现后端API
    • AddService接口
    • AddService接口实现
    • AddController
    • 添加bot记录的前端页面
    • RemoveServiceImpl
    • RemoveController
    • 前端删除Bot记录测试
    • UpdateServiceImpl
    • UpdateController
    • Update前端测试
    • GetListImpl
    • GetListController
    • 前端页面测试

创建一个user表

创建pojo.bot

package com.kob.backedn2.pojo;import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableId;
import com.fasterxml.jackson.annotation.JsonFormat;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import java.util.Date;// 变量一定是驼峰命名
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Bot {// 主键自增  添加注解@TableId(type = IdType.AUTO)private Integer id;private Integer userId;private String title;private String description;private  String content;private Integer rating;// 注解添加日期格式@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")private Date createtime;@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")private Date modifytime;
}

实现后端API

AddService接口

package com.kob.backedn2.service.user.bot;import java.util.Map;// 添加bot接口
public interface AddService {public Map<String,String> add(Map<String,String> data);
}

AddService接口实现

package com.kob.backedn2.service.impl.user.bot;import com.kob.backedn2.mapper.BotMapper;
import com.kob.backedn2.pojo.Bot;
import com.kob.backedn2.pojo.User;
import com.kob.backedn2.service.impl.utils.UserDetailsImpl;
import com.kob.backedn2.service.user.bot.AddService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.authentication.UsernamePasswordAuthenticationToken;
import org.springframework.security.core.context.SecurityContextHolder;
import org.springframework.stereotype.Service;import java.util.Date;
import java.util.HashMap;
import java.util.Map;@Service
public class AddServiceImpl implements AddService {// 将接口注入进来@Autowiredprivate BotMapper botMapper;// 使用Mapper操作数据库@Overridepublic Map<String, String> add(Map<String, String> data) {// 从token中获取用户UsernamePasswordAuthenticationToken authenticationToken = (UsernamePasswordAuthenticationToken) SecurityContextHolder.getContext().getAuthentication();UserDetailsImpl loginUser = (UserDetailsImpl) authenticationToken.getPrincipal();User user = loginUser.getUser();// 根据key获取map中的数据String title = data.get("title");String description = data.get("description");String content = data.get("content");Map<String,String> map = new HashMap<>();if(title == null || title.length() == 0){map.put("error_message","标题不能为空");return map;}if(title.length() > 100){map.put("error_message","标题长度不能大于100");return map;}if(description == null || description.length() == 0){description = "这个用户很懒，什么也没留下";}if(description != null && description.length() > 300){map.put("error_message","Bot描述的长度不能大于300");return map;}if(content == null || content.length() == 0){map.put("error_message","代码不能为空");return map;}if(content.length() > 10000){map.put("error_message","代码长度不能超过10000");return map;}// 创建一个bot对象Date now = new Date();Bot bot = new Bot(null,user.getId(),title,description,content,1500,now,now);// 将Bot对象添加到数据库中botMapper.insert(bot);map.put("error_message","success");return map;}
}

AddController

package com.kob.backedn2.controller.user.bot;import com.kob.backedn2.service.user.bot.AddService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;import java.util.Map;@RestController
public class AddController {// 将实现的service接口进行注入@Autowiredprivate AddService addService;// 用户访问该url路径 获取资源@PostMapping("/user/bot/add/")public Map<String,String> add(@RequestParam Map<String,String> data){// 调用service 插入数据return addService.add(data);}
}

添加bot记录的前端页面

点击我的bot页面 自动创建一个bot

<template><ContentField>我的Bot</ContentField>
</template><script>
import ContentField from '../../../components/ContentField.vue'
import $ from 'jquery'
import { useStore} from 'vuex';export default {components: {ContentField},setup(){const store = useStore();// 获取全局资源$.ajax({url:"http://127.0.0.1:3000/user/bot/add/",type:"POST",data:{title:"Bot的标题",description:"Bot的描述",content:"Bot的代码",},headers:{// 验证Authorization:"Bearer " + store.state.user.token,},success(resp){//  打印是否成功的消息console.log(resp);},error(resp){console.log(resp);}})}
}
</script><style scoped>
</style>

RemoveServiceImpl

package com.kob.backedn2.service.impl.user.bot;import com.kob.backedn2.mapper.BotMapper;
import com.kob.backedn2.pojo.Bot;
import com.kob.backedn2.pojo.User;
import com.kob.backedn2.service.impl.utils.UserDetailsImpl;
import com.kob.backedn2.service.user.bot.RemoveService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.authentication.UsernamePasswordAuthenticationToken;
import org.springframework.security.core.context.SecurityContextHolder;
import org.springframework.stereotype.Service;import java.util.HashMap;
import java.util.Map;@Service
public class RemoveServiceImpl implements RemoveService {@Autowiredprivate BotMapper botMapper;@Overridepublic Map<String, String> remove(Map<String, String> data) {UsernamePasswordAuthenticationToken authenticationToken = (UsernamePasswordAuthenticationToken) SecurityContextHolder.getContext().getAuthentication();UserDetailsImpl loginUser = (UserDetailsImpl) authenticationToken.getPrincipal();User user = loginUser.getUser();// 获取用户int bot_id = Integer.parseInt(data.get("bot_id"));// 获取bot的id// 获取botBot bot = botMapper.selectById(bot_id);Map<String,String> map = new HashMap<>();if(bot == null){map.put("error_message","Bot不存在或者已经被删除");return map;}if(!bot.getUserId().equals(user.getId())){map.put("error_message","没有权限删除bot");return map;}// 删除botMapper.deleteById(bot_id);map.put("error_message","success");return null;}
}

RemoveController

package com.kob.backedn2.controller.user.bot;import com.kob.backedn2.service.user.bot.RemoveService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;import java.util.Map;@RestController
public class RemoveController {@Autowiredprivate RemoveService removeService;@PostMapping("/user/bot/remove")public Map<String,String> remove(@RequestParam Map<String,String> data){return removeService.remove(data);//调用service接口的方法}}

前端删除Bot记录测试

<template><ContentField>我的Bot</ContentField>
</template><script>
import ContentField from '../../../components/ContentField.vue'
import $ from 'jquery'
import { useStore} from 'vuex';export default {components: {ContentField},setup(){const store = useStore();// 获取全局资源// $.ajax({//     url:"http://127.0.0.1:3000/user/bot/add/",//     type:"POST",//     data:{//         title:"Bot的标题",//         description:"Bot的描述",//         content:"Bot的代码",//     },//     headers://     {//         // 验证//         Authorization:"Bearer " + store.state.user.token,//     },//     success(resp){//         //  打印是否成功的消息//         console.log(resp);//     },//     error(resp){//         console.log(resp);//     }// })$.ajax({url:"http://127.0.0.1:3000/user/bot/remove/",type:"POST",data:{// 删除bot_id 为2 的数据库Bot记录bot_id:2,},headers:{// 验证Authorization:"Bearer " + store.state.user.token,},success(resp){//  打印是否成功的消息console.log(resp);},error(resp){console.log(resp);}})}
}
</script><style scoped>
</style>

UpdateServiceImpl

package com.kob.backedn2.service.impl.user.bot;import com.kob.backedn2.mapper.BotMapper;
import com.kob.backedn2.pojo.Bot;
import com.kob.backedn2.pojo.User;
import com.kob.backedn2.service.impl.utils.UserDetailsImpl;
import com.kob.backedn2.service.user.bot.UpdateService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.authentication.UsernamePasswordAuthenticationToken;
import org.springframework.security.core.context.SecurityContextHolder;
import org.springframework.stereotype.Service;import javax.jws.soap.SOAPBinding;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;@Service
public class UpdateServiceImpl implements UpdateService {@Autowiredprivate BotMapper botMapper;@Overridepublic Map<String, String> update(Map<String, String> data) {// 现根据token知道自己是谁 获取userUsernamePasswordAuthenticationToken usernamePasswordAuthenticationToken = (UsernamePasswordAuthenticationToken) SecurityContextHolder.getContext().getAuthentication();UserDetailsImpl loginUser = (UserDetailsImpl) usernamePasswordAuthenticationToken.getPrincipal();User user = loginUser.getUser();// 然后获取前端返回的数据  首先根据data中的bot_id 获取idint bot_id = Integer.parseInt(data.get("bot_id"));// 获取的是字符串  然后解析成int数据// 从data数据中获取title description  content三个信息  填充到新的Bot记录 然后使用Mapper接口 插入到数据库String title = data.get("title");String description = data.get("description");String content = data.get("content");Map<String,String> map = new HashMap<>();// 根据前端解析出来的bot_id  使用botMapper接口 查询数据库 返回一个bot记录Bot bot = botMapper.selectById(bot_id);if(title == null || title.length() == 0){map.put("error_message","标题不能为空");return map;}if(title.length() > 100){map.put("error_message","标题长度不能大于100");return map;}if(description == null || description.length() == 0){description = "这个用户很懒，什么也没留下";}if(description != null && description.length() > 300){map.put("error_message","Bot描述的长度不能大于300");return map;}if(content == null || content.length() == 0){map.put("error_message","代码不能为空");return map;}if(content.length() > 10000){map.put("error_message","代码长度不能超过10000");return map;}if(bot == null){map.put("error_message","Bot不存在或者已经删除");return map;}if(!bot.getUserId().equals(user.getId())){map.put("error_message","没有权限修改Bot");return  map;}Bot new_bot = new Bot(bot.getId(),user.getId(),title,description,content,bot.getRating(),bot.getCreatetime(),new Date());// 调用接口 更新BotbotMapper.updateById(new_bot);map.put("error_message","success");return map;}
}

UpdateController

package com.kob.backedn2.controller.user.bot;import com.kob.backedn2.service.user.bot.UpdateService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;import java.util.Map;@RestController
public class UpdateController {// 注入实现的接口 然后调用实现的接口板中的方法@Autowiredprivate UpdateService updateService;// 将请求获取的data容器 作为参数 传入service接口中@PostMapping("/user/bot/update/")public Map<String,String> update(@RequestParam Map<String,String> data){return updateService.update(data);}
}

Update前端测试

<template><ContentField>我的Bot</ContentField>
</template><script>
import ContentField from '../../../components/ContentField.vue'
import $ from 'jquery'
import { useStore} from 'vuex';export default {components: {ContentField},setup(){const store = useStore();// 获取全局资源// $.ajax({//     url:"http://127.0.0.1:3000/user/bot/add/",//     type:"POST",//     data:{//         title:"Bot的标题",//         description:"Bot的描述",//         content:"Bot的代码",//     },//     headers://     {//         // 验证//         Authorization:"Bearer " + store.state.user.token,//     },//     success(resp){//         //  打印是否成功的消息//         console.log(resp);//     },//     error(resp){//         console.log(resp);//     }// })// $.ajax({//     url:"http://127.0.0.1:3000/user/bot/remove/",//     type:"POST",//     data:{//         // 删除bot_id 为1 的数据库Bot记录//         bot_id:1,//     },//     headers://     {//         // 验证//         Authorization:"Bearer " + store.state.user.token,//     },//     success(resp){//         //  打印是否成功的消息//         console.log(resp);//     },//     error(resp){//         console.log(resp);//     }// })$.ajax({url:"http://127.0.0.1:3000/user/bot/update/",type:"POST",data:{// 删除bot_id 为1 的数据库Bot记录bot_id:3,title:"更新的标题",description:"更新的描述",content:"更新的代码",},headers:{// 验证Authorization:"Bearer " + store.state.user.token,},success(resp){//  打印是否成功的消息console.log(resp);},error(resp){console.log(resp);}})}
}
</script><style scoped>
</style>

GetListImpl

package com.kob.backedn2.service.impl.user.bot;import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.kob.backedn2.mapper.BotMapper;
import com.kob.backedn2.pojo.Bot;
import com.kob.backedn2.pojo.User;
import com.kob.backedn2.service.impl.utils.UserDetailsImpl;
import com.kob.backedn2.service.user.bot.GetListService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.authentication.UsernamePasswordAuthenticationToken;
import org.springframework.security.core.context.SecurityContextHolder;
import org.springframework.stereotype.Service;import java.util.List;@Service
public class GetListServiceImpl implements GetListService {@Autowiredprivate BotMapper botMapper;// 注入数据库查询接口@Overridepublic List<Bot> getList() {UsernamePasswordAuthenticationToken authenticationToken = (UsernamePasswordAuthenticationToken) SecurityContextHolder.getContext().getAuthentication();UserDetailsImpl loginUser = (UserDetailsImpl) authenticationToken.getPrincipal();User user = loginUser.getUser();QueryWrapper<Bot> queryWrapper = new QueryWrapper<>();queryWrapper.eq("user_id",user.getId());return botMapper.selectList(queryWrapper);}
}

GetListController

package com.kob.backedn2.controller.user.bot;import com.kob.backedn2.pojo.Bot;
import com.kob.backedn2.service.user.bot.GetListService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.List;@RestController
public class GetListController {@Autowiredprivate GetListService getListService;@GetMapping("/user/bot/getlist/")public List<Bot> getList(){return getListService.getList();}}

前端页面测试

<template><ContentField>我的Bot</ContentField>
</template><script>
import ContentField from '../../../components/ContentField.vue'
import $ from 'jquery'
import { useStore} from 'vuex';export default {components: {ContentField},setup(){const store = useStore();// 获取全局资源// $.ajax({//     url:"http://127.0.0.1:3000/user/bot/add/",//     type:"POST",//     data:{//         title:"Bot的标题",//         description:"Bot的描述",//         content:"Bot的代码",//     },//     headers://     {//         // 验证//         Authorization:"Bearer " + store.state.user.token,//     },//     success(resp){//         //  打印是否成功的消息//         console.log(resp);//     },//     error(resp){//         console.log(resp);//     }// })// $.ajax({//     url:"http://127.0.0.1:3000/user/bot/remove/",//     type:"POST",//     data:{//         // 删除bot_id 为1 的数据库Bot记录//         bot_id:1,//     },//     headers://     {//         // 验证//         Authorization:"Bearer " + store.state.user.token,//     },//     success(resp){//         //  打印是否成功的消息//         console.log(resp);//     },//     error(resp){//         console.log(resp);//     }// })// $.ajax({//     url:"http://127.0.0.1:3000/user/bot/update/",//     type:"POST",//     data:{//         // 删除bot_id 为1 的数据库Bot记录//         bot_id:3,//         title:"更新的标题",//         description:"更新的描述",//         content:"更新的代码",//     },//     headers://     {//         // 验证//         Authorization:"Bearer " + store.state.user.token,//     },//     success(resp){//         //  打印是否成功的消息//         console.log(resp);//     },//     error(resp){//         console.log(resp);//     }// })$.ajax({url:"http://127.0.0.1:3000/user/bot/getlist/",type:"get",headers:{// 验证Authorization:"Bearer " + store.state.user.token,},success(resp){//  打印是否成功的消息console.log(resp);},error(resp){console.log(resp);}})}
}
</script><style scoped>
</style>

【Java闭关修炼】SpringBoot项目-贪吃蛇对战小游戏-创建个人中心页面（上）相关推荐

  1. 【Java闭关修炼】SpringBoot项目-贪吃蛇对战小游戏-配置git环境和项目创建

    [Java闭关修炼]SpringBoot项目-贪吃蛇对战小游戏-配置git环境和项目创建 项目的逐步细分 配置git环境 创建项目后端 前后端不分离写法-url访问路径解析资源 安装vue vue文件 ...

  2. 【Java闭关修炼】SpringBoot项目-贪吃蛇对战小游戏-配置Mysql与注册登录模块2

    [Java闭关修炼]SpringBoot项目-贪吃蛇对战小游戏-配置Mysql与注册登录模块2 传统的登录验证模式 JWT登录验证方式 下载安装依赖 创建JWTUTIL JwtAuthenticati ...

  3. 基于Java实现的贪吃蛇大作战小游戏

    贪吃蛇大作战小游戏 整体思路与架构 本项目主要分为三个部分,即UI界面.游戏逻辑与网络传输. UI界面部分,主要是为了实现不同界面之间的切换.包括了注册登陆窗口(loginFrame)与游戏主窗口(G ...

  4. Java实现贪吃蛇大作战小游戏（完整教程+源码）额外实现积分和变速功能

    大家好,我是黄小黄同学!今天给大家带来的是小项目是 基于Java+Swing+IO流实现 的贪吃蛇大作战小游戏.实现了界面可视化.基本的吃食物功能.死亡功能.移动功能.积分功能,并额外实现了主动加速和 ...

  5. 贪吃蛇html网页小游戏,网页贪吃蛇HTML5小游戏制作

    贪吃蛇是以前我们经常在手机里玩的一个小游戏,现在要是把它搬到网页上也会让人更回味.这是一款非常有趣的HTML5响应式网页贪吃蛇小游戏.在游戏中你可以使用键盘的上下左右来控制蛇的运动方向.现在要列出的是 ...

  6. 贪吃蛇宝宝微信小游戏cocoscreator

    非常有趣的创意玩法贪吃蛇一笔画玩法 里面将近有1000关游戏,分为三个难度 乡试 会试 殿试 每个难度通过200关可以解锁下一个难度 在这里插入图片描述 每得到一条蛇就会产生离线收益 兑换道具! 这款 ...

  7. 纯JS实现贪吃蛇——超上瘾小游戏！！！

    效果图 最近使用 JS 写了一个贪吃蛇游戏,效果如下: 谷歌浏览器点击直接在线玩 前言 贪吃蛇作为一款经典又简单的小游戏,每个人都玩过.实现一个贪吃蛇游戏基本具有以下功能: 棋盘(也被称作 " ...

  8. java联机_Java实现简易联网坦克对战小游戏

    介绍 通过本项目能够更直观地理解应用层和运输层网络协议, 以及继承封装多态的运用. 网络部分是本文叙述的重点, 你将看到如何使用Java建立TCP和UDP连接并交换报文, 你还将看到如何自己定义一个简 ...

  9. python小游戏贪吃蛇下载_python小游戏之贪吃蛇

    importpygame,sys,time,randomfrom pygame.locals import * #定义颜色变量 redColour = pygame.Color(255,0,0) bl ...

  10. 贪吃蛇（欢乐小游戏）

    #include"墙.h" #include"标头.h" #include"蛇.h" #include"食物.h" #i ...

最新文章

  1. leetcode算法题--重排链表★
  2. 深入浅出JMS(四)--Spring和ActiveMQ整合的完整实例
  3. java set的first_Java TreeSet pollFirst()方法与示例
  4. Kettle 之 javascript字段数据处理
  5. 考研计算机考试408背诵,今年上岸计算机准研究生分享一下计算机考研（408）经验...
  6. CSS 设置背景颜色透明，文字不透明
  7. 拆分SharePoint 2013 中CreatedModifiedInfo 的时间
  8. Unity3D基础36：场景自适应与场景切换
  9. 大小端判断及相互转化
  10. YII2 搭建redis拓展(教程)
  11. 学会了Python就可以做数据分析师？别天真了
  12. 数据结构---树和二叉树03
  13. kaggle：NBA球员投篮数据分析与可视化
  14. java的面向抽象原则
  15. GNSS/IMU紧耦合学习笔记之卫星数据处理
  16. z=z(x,y)中面积积分和方向余弦
  17. clannad手游汉化版_clannad游戏中文版
  18. ALSA声卡驱动中的DAPM详解之一：kcontrol
  19. 多地政府提及元宇宙发展 | 产业区块链发展周报
  20. 题目1（15分）对spark1.txt文件进行筛选，将A或者包含A的字母筛选出来并统计个数，然后输出到dome1文件中。

热门文章

  1. ctfshow 网络迷踪做题记录（2）
  2. 解决富文本（RichEditControl）复制粘贴文本文字不显示的问题
  3. 华硕fl8000uf笔记本一键u盘安装win10系统教程
  4. 第9章、编译期元编程和AST转换
  5. React路由传参v5-v6
  6. 浏览器cookie_浏览器Cookie的敌人或朋友
  7. mysql自动拉入黑名单_负载均衡与黑名单
  8. 01-基础入门-概念名词
  9. 802.1x 之EAP-TLS介绍
  10. 谷歌在华前途未卜 微软等公司频频挖角