創建項目
用Spring Boot starters快速創建一個項目
勾選Web
PS:我的IDEA每次創建springboot項目要把pom裏的版本從2.2.4改成2.2.2才能跑起來...
<version>2.2.2.RELEASE</version>
當你的項目想集合一些組件時,這個網址有很多開源方案
https://spring.io/guides/gs/serving-web-content/
導入thymeleaf依賴:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
Create a Web Controller
community\src\main\java\life\majiang\community\Controller\GreetingController.java
@Controller
public class GreetingController {
@GetMapping("/greeting")
public String greeting(@RequestParam(name="name", required=false, defaultValue="World") String name, Model model) {
model.addAttribute("name", name);
return "greeting";
}
}
我們將其逐步分解。
@GetMapping 確保將對/ greeting的HTTP GET請求映射到greeting()方法。
@RequestParam將查詢字符串參數名稱的值綁定到greeting()方法的參數中。
如果請求中不存在,則使用defaultValue。
name參數的值將添加到Model對象,最終使模板可以訪問它。
當你不知道在@RequestParam傳什麼參數時,按住ctrl+p會有提示
community\src\main\resources\templates\greeting.html
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Getting Started: Serving Web Content</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<p th:text="'Hello, ' + ${name} + '!'" />
</body>
</html>
顯示:
創建倉庫
將項目上傳到Github
使用Bootstrap
下載Bootstrap
解壓後ctrlv到static中
引入資源
community\src\main\resources\templates\index.html
<link rel="stylesheet" href="css/bootstrap.min.css"/>
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<script src="js/bootstrap.min.js" type="application/javascript"></script>
默認導航條,放入index.html中
community\src\main\java\life\majiang\community\Controller\IndexController.java
@Controller
public class IndexController {
@GetMapping("/")
public String index() {
return "index";
}
}
會返回到修改好後的index.html中
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>社區</title>
<link rel="stylesheet" href="css/bootstrap.min.css"/>
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<script src="js/bootstrap.min.js" type="application/javascript"></script>
</head>
<body>
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">社區</span>
</button>
<a class="navbar-brand" href="#">社區</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<form class="navbar-form navbar-left">
<div class="form-group">
<input type="text" class="form-control" placeholder="搜索問題">
</div>
<button type="submit" class="btn btn-default">搜索</button>
</form>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">登錄</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">我<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">消息中心</a></li>
<li><a href="#">個人資料</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">退出登錄</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
</body>
</html>
運行項目就會有一個導航欄了
註冊GitHub App
流程:
點擊登錄按鈕
調用一個授權地址:https://github.com/login/oauth/authorize
<li>
<a href="https://github.com/login/oauth/authorize?
client_id=d91ecbf97a04759b945e
&redirect_uri=http://localhost:8080/callback&scope=user&state=1">登錄</a>
</li>
回調redirect-uri,返回一個code
@Controller
public class AuthorizeController {
@GetMapping("/callback")
public String callback(@RequestParam(name = "code") String code,
@RequestParam(name = "state") String state) {
拿着access-token攜帶code
用accessTokenDTO封裝好的數據傳遞到githubProvider中
public class AccessTokenDTO {
private String cliend_id; //因爲這個單詞打錯了一直404,找了一下午
private String client_secret;
private String code;
private String redirect_uri;
private String state;
AccessTokenDTO accessTokenDTO = new AccessTokenDTO();
accessTokenDTO.setCode(code);
accessTokenDTO.setCliend_id("d91ecbf97a04759b945e");
accessTokenDTO.setClient_secret("749a87845bceadf74377271113392a9eb0a70");
accessTokenDTO.setRedirect_uri("http://localhost:8080/callback");
accessTokenDTO.setState(state);
githubProvider.getAccessToken(accessTokenDTO);
接着在GithubProvider利用okhttp和fastjson
發post請求將accessTokenDTO傳到https://github.com/login/oauth/access_token裏拿到access_token
@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()) {
return response.body().string();
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
返回access-token
access_token=e72e16c7e42f292c6912e7710c838347ae178b4a&token_type=bearer
拿着user攜帶access-token
public GithubUser getUser(String accessToken) {
OkHttpClient client = new OkHttpClient();
Request request = new Request.Builder()
.url("https://api.github.com/user?access_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;
}
返回user信息
String accessToken = githubProvider.getAccessToken(accessTokenDTO);
GithubUser user = githubProvider.getUser(accessToken);
System.out.println(user.getName() + " " + user.getBio());
配置properties
github.client.id=d91ecbf97a04759b945e
github.client.secret=749a87845bceadf74377271113392a9eb0a70
github.redirect.uri=http://localhost:8080/callback
Value註解從配置文件中取得值
@Value("${github.client.id}")
private String clientId;
@Value("${github.client.secret}")
private String clientSecret;
@Value("${github.redirect.uri}")
private String redirectUri;
@GetMapping("/callback")
public String callback(@RequestParam(name = "code") String code,
@RequestParam(name = "state") String state,
HttpServletRequest request) {
AccessTokenDTO accessTokenDTO = new AccessTokenDTO();
accessTokenDTO.setCode(code);
accessTokenDTO.setClient_id(clientId);
accessTokenDTO.setClient_secret(clientSecret);
accessTokenDTO.setRedirect_uri(redirectUri);
accessTokenDTO.setState(state);
將代碼託管帶Github
idea使用git命令
把gitbash替換掉idea的默認的終端(cmd),那麼在idea上
ettings--->tools--->Terminal中的shell path 填上 :D:\Program Files\Git\bin\bash.exe
create a new repository on the command line
echo "# community" >> README.md
git init
git add README.md
git commit -m "first commit"
git remote add origin https://github.com/DD4399/community.git
git push -u origin master
第一步:初始化git倉庫:git init
會出現Reinitialized existing Git repository in F:/community/.git/
第二步:git commit -m "init repo"
輸入git status會有:
On branch master
nothing to commit, working tree clean
第三步:設置郵箱和用戶名
輸入命令:ls .git
vim .git/config
寫上user的name和email
git config --global user.email yaowang4.xxxxxx.com ===>>>
設置用戶郵箱
git config --global user.name 01234567? ===>>>
設置git的用戶名
git config --list? ===>>>? 查看設置內容
輸入這兩個命令:
git remote add origin https://github.com/DD4399/community.git
git push -u origin master
之後輸入自己的賬號和密碼即可上傳代碼
再次提交代碼:
1.git status查看沒有提交的狀態
2.git add .提交當前目錄所有文件,文件顏色會變成綠色
3.git commit -m "addreadme"
4.git push