1.项目访问地址—120.24.20.45
2.团队成员名字、任务分配以及博客地址
成员名字 | 任务分配 | 博客地址 |
---|---|---|
陈艺彬(队长) | 1.index页面编写与对应后端功能实现2.部署项目到服务器 | https://blog.csdn.net/Chenyibin_/article/details/113343989 |
谢智斌 | question页面和publish页面的编写与对应后端功能实现 | |
林威 | github登录和navigation页面的编写与对应后端功能实现 | https://blog.csdn.net/qq_45887326/article/details/113330070 |
洪安珂 | error页面编写与对应后端功能实现和footer页面 |
3.项目是基于SprtingBoot和BostStrap开发的Web论坛
3.1.SpringBoot的介绍
-
SpringBoot相当于一个管家,管理了spring,springMVC,mybatis等框架。
-
SpringMVC:作为 View 层的实现者,完成用户的请求接收功能。SpringMVC 的 Controller作为整个应用的控制器,完成用户请求的转发及对用户的响应。
-
MyBatis:作为 Dao 层的实现者,完成对数据库的增、删、改、查功能。
-
Spring:以整个应用大管家的身份出现。整个应用中所有 Bean 的生命周期行为,均由Spring 来管理。即整个应用中所有对象的创建、初始化、销毁,及对象间关联关系的维护,均由 Spring 进行管理。
3.2.项目开发模式为MVC
MVC框架是由Model模型(JavaBean),View视图(Html,css,jsp) 和Controller控制器(Servlet)构成
- 其中每一部分的作用为:
-
Model:承载数据,并对用户提交请求进行计算的模块。其分为两类,一类称为数据承载Bean,一类称为业务处理Bean。所谓数据承载Bean是指实体类,专门承载业务数据的,如Student、User等。而业务处理Bean则是指Service或Dao对象,专门用于处理用户提交请求的。
-
View:为用户提供使用界面,与用户直接进行交互
-
Controller:用于将用户请求转发给相应的Model进行处理,并将处理Model的计算结果向用户提供相应响应。
4.使用的技术介绍及部分代码展示
4.1第三方github授权登录
第三方登入主要基于OAuth 2.0。OAuth协议为用户资源的授权提供了一个安全的、开放而又简易的标准。与以往的授权方式不同之处是OAUTH的授权不会使第三方触及到用户的帐号信息(如用户名与密码),即第三方无需使用用户的用户名与密码就可以申请获得该用户资源的授权,因此OAUTH是安全的
大致流程为下图
实现代码如下:
页面点击a标签跳转到github授权登录页面
<li th:if="${session.user==null}">
<a href="https://github.com/login/oauth/authorize?client_id=176d5015d09f311f577e&redirect_uri=http://120.24.20.45:80/callback&scope=user&state=1">登录
</a>
</li>
AuthorizeController实现接收github返回的code调用GitHubProvider类的方法来获取用户信息
@Controller
public class AuthorizeController {
@Autowired
GitHubProvider gitHubProvider;
@Value("${github.client.id}")
private String clientid;
@Value("${github.client.secret}")
private String clientsercet;
@Value("${github.redirect.uri}")
private String uri;
@Autowired
private UserService userService;
@GetMapping("/callback")
public String callback(@RequestParam(name="code") String code,
@RequestParam(name="state") String state,
HttpServletRequest request,
HttpServletResponse response){
AccessTokenDTO accessTokenDTO = new AccessTokenDTO();
accessTokenDTO.setClient_id(clientid);
accessTokenDTO.setClient_secret(clientsercet);
accessTokenDTO.setCode(code);
accessTokenDTO.setRedirect_uri(uri);
accessTokenDTO.setState(state);
String accessToken = gitHubProvider.getAccessToken(accessTokenDTO);
GitHubUser gitHubUser = gitHubProvider.getUser(accessToken);
if(gitHubUser!=null){
User user = new User();
String token=UUID.randomUUID().toString();
user.setToken(token);
user.setName(gitHubUser.getName());
user.setAccountId(String.valueOf(gitHubUser.getId()));
user.setAvatarUrl(gitHubUser.getAvatarurl());
userService.createOrUpdate(user);
response.addCookie(new Cookie("token",token));
return "redirect:/";
}
else{
return "redirect:/";
}
}
}
GitHubProvider类的方法实现代码
@Component
public class GitHubProvider {
public String getAccessToken(AccessTokenDTO accessTokenDTO){
MediaType mediaType = MediaType.get("application/json;charset=utf-8");
OkHttpClient client = new OkHttpClient();
RequestBody body = RequestBody.create(mediaType, JSON.toJSONString(accessTokenDTO));
Request request = new Request.Builder().url("https://github.com/login/oauth/access_token")
.post(body).build();
try {
Response response = client.newCall(request).execute();
String string = response.body().string();
String token = string.split("&")[0].split("=")[1];
return token;
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
public GitHubUser getUser(String accessToken){
OkHttpClient client = new OkHttpClient();
Request request = new Request.Builder()
.url("https://api.github.com/user")
.header("Authorization","token "+accessToken)
.build();
try {
Response response = client.newCall(request).execute();
String string = response.body().string();
GitHubUser gitHubUser = JSON.parseObject(string, GitHubUser.class);
return gitHubUser;
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
}
GitHubUser类是用来承载用户数据的
(简单介绍一下lombok,lombok会自动生成gettersetter,tostring,constructor。
使用方法:1.先导入对应的maven
2.打上@Data注解)
import lombok.Data;
@Data
public class GitHubUser {
private String name;
private long id;
private String bio;
private String avatarurl;
}
4.2使用工具mybatis-generator自动生成Mybatis代码
4.3使用Bootstrap前端框架
Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。
4.4使用模板语言Thymeleaf进行开发
4.5部署项目到服务器的步骤及方法
1.用maven的package命令打包项目成为jar包
2.用一些FTP软件将本地的jar包上传到服务器上
3.使用Linux命令运行jar包,项目启动