搭建教程參考:www.jianshu.com/p/d6b7a2806…javascript
IDE推薦:Intellij IDEA
php
HelloController
控制類,主要用於處理髮送的一系列請求import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.bind.annotation.RequestMapping;
複製代碼
//@RestController爲@ResponseBody和@Controller的結合
@RestController
public class HelloController {
//value爲url後綴 method爲http請求方法,默認爲get
@RequestMapping(value="/hello",method = RequestMethod.GET)
public String hello() {
return "Hello,World!" ;
}
@RequestMapping("goodbye")
public String goodbye(){
return "Say goodbye";
}
}
複製代碼
1.在pom.xml
中添加thymeleaf
模板引擎字段css
<!-- 添加thymeleaf 模板引擎 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
複製代碼
2.在application.properties
中設置尋找目錄html
spring.thymeleaf.prefix=classpath:/templates/
複製代碼
HelloController
當中修改頭RestController
爲Controller
package com.mainpackage.webchat;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.bind.annotation.RequestMapping;
// 項目搭建參考:https://www.jianshu.com/p/d6b7a2806655
//@RestController爲@ResponseBody和@Controller的結合
//@Controller 實現靜態頁面訪問
@Controller
public class HelloController {
//value爲url後綴 method爲http請求方法,默認爲get
@RequestMapping(value="/hello",method = RequestMethod.GET)
public String hello() {
return "indexs" ;
}
}
複製代碼
前端加載 css文件方法前端
在對應的html文件中加入如下內容便可:java
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
複製代碼
做用是引入thymeleaf框架mysql
<link rel="stylesheet" type="text/css" media="all" th:href="@{/base.css}" />
複製代碼
其中base.css
是相對於static
而言web
經過設置@RequestParam
參數 來實現get請求,其中一個注意點是參數名要和請求名是一致的。spring
示例代碼:sql
package com.mainpackage.webchat;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.bind.annotation.RequestMapping;
import java.net.http.HttpRequest;
import org.springframework.web.bind.annotation.RequestParam;
// 項目搭建參考:https://www.jianshu.com/p/d6b7a2806655
//@RestController爲@ResponseBody和@Controller的結合
@RestController
public class HelloController {
//value爲url後綴 method爲http請求方法,默認爲get
@RequestMapping(value="/login",method = RequestMethod.GET)
//name 爲get請求的請求名,須要與參數名相一致。
public String login(@RequestParam String name) {
return name;
}
}
複製代碼
在本地運行:只須要在地址欄輸入http://localhost:8080/login?name=smm
其中smm爲自定義參數,能夠隨便輸入字符串,瀏覽器將會在界面上只顯示該字符,說明簡單的get請求實現成功!
舉個例子而言,若是用戶但願,地址欄輸入http://localhost:8080/ddd
,前端頁面結果會帶有ddd,這種需求要實現。
這種是最簡單的url綁定,參考代碼以下:
//使用這種能夠直接避免參數不一樣
//其中value的account參數要與底下的PathVariable相同,實現url綁定的一種方式。
@RequestMapping(value = "/{account}",method = RequestMethod.GET)
public String account(@PathVariable("account") String accountInfo ) {
return accountInfo;
}
複製代碼
傳參後端:
package com.mainpackage.webchat;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import java.util.Map;
import java.net.http.HttpRequest;
//用戶類
@Controller
public class UserController {
//登陸模塊測試
@RequestMapping(value="/userlogin",method = RequestMethod.GET)
//map 能夠被傳到前端去
public String login(Map <String, Object> map) {
map.put("message2","mm");
//name = "測試";
return "passparam";
}
}
複製代碼
tip: Map<String,Object>
有點相似於Json格式傳到前端中,前端只要經過[[${param}]]
獲取便可
前端代碼:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>傳遞參數實例</title>
<script type="javascript"> </script>
</head>
<body>
<!--使用先後不分離技術傳參測試-->
<h1>測試參數</h1>
<p id="message2"> 傳參:[[${message2}]] </p>
</body>
</html>
複製代碼
前端獲取[[${message2}]]
:前端message2爲後端傳遞的參數
pom.xml
文件中添加以下文件:<!--添加mysql數據庫依賴-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-jdbc</artifactId>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
</dependency>
<!--end-->
複製代碼
做用是添加數據庫依賴
application.properties
當中添加數據庫配置#數據庫配置
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
#數據庫鏈接
spring.datasource.url = jdbc:mysql://localhost:3306/login_db?useUnicode=true&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=UTC
#用戶名
spring.datasource.username=root
#密碼
spring.datasource.password=123456 #此處爲mysql數據庫的密碼
複製代碼
須要注意的一點是 在spring.datasource.url
當中,須要login_db爲數據庫名,你們後面改的話只有改login_db爲本身的數據庫名便可。
//數據庫相關包
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.sql.DataSource;
import org.springframework.beans.factory.annotation.Autowired;
//測試mysql數據庫鏈接狀況 參考教程:https://www.jianshu.com/p/c440b57f4531
@Autowired
DataSource dataSource;
@RequestMapping("/mysqltest")
public Object mysqltest() throws Exception {
Connection connect = dataSource.getConnection();
PreparedStatement pre = connect.prepareStatement("select * from login_tb");
ResultSet result = pre.executeQuery();
List<Map<String,Object>> list = new ArrayList<Map<String,Object>>();
while (result.next()) {
Map<String,Object> map = new HashMap<String, Object>();
map.put("id", result.getObject("id"));
map.put("name", result.getObject("name"));
list.add(map);
}
if(result!= null ) result.close();
if(pre!= null ) pre.close();
if(connect!= null ) connect.close();
return list;
}
複製代碼
其中注意的一點是login_tb
指的是表,這個是本身提早建的表。
而後啓動項目,在地址欄輸入http://localhost:8080/mysqltest
有返回值Json數據則說明搭建成功。
功能實現參考過該文章https://zhuanlan.zhihu.com/p/55796334
經過實例學習Spring Boot 登陸、註冊功能,既能夠學習如何使用數據庫,並且對post請求,能夠有必定的用法瞭解。
MySQL數據庫配置完成,配置教程參照七;
配置依賴,主要就是四個依賴,Thymeleaf
,JPA
,MySQL
,Web
實現:
在pom.xml
文件中,添加下列依賴:
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.2.0.M5</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.mainpackage</groupId>
<artifactId>webchat</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>webchat</name>
<description>build a site for online webchat</description>
<properties>
<java.version>12</java.version>
</properties>
<dependencies>
<!--web依賴-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- 添加thymeleaf 模板引擎 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!--添加mysql數據庫依賴-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-jdbc</artifactId>
</dependency>
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
</dependency>
<!--end-->
<!--添加JPA依賴-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-jpa</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
<exclusions>
<exclusion>
<groupId>org.junit.vintage</groupId>
<artifactId>junit-vintage-engine</artifactId>
</exclusion>
<exclusion>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
</exclusion>
</exclusions>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
<repositories>
<repository>
<id>spring-milestones</id>
<name>Spring Milestones</name>
<url>https://repo.spring.io/milestone</url>
</repository>
</repositories>
<pluginRepositories>
<pluginRepository>
<id>spring-milestones</id>
<name>Spring Milestones</name>
<url>https://repo.spring.io/milestone</url>
</pluginRepository>
</pluginRepositories>
</project>
複製代碼
application.properties
添加MySQL
、thymeleaf
、JPA
配置信息
# 設置尋找目錄
spring.thymeleaf.prefix=classpath:/templates/
#MySQL數據庫配置
spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
#數據庫鏈接
spring.datasource.url = jdbc:mysql://localhost:3306/login_db?useUnicode=true&useJDBCCompliantTimezoneShift=true&useLegacyDatetimeCode=false&serverTimezone=UTC
#用戶名
spring.datasource.username=root
#密碼
spring.datasource.password=445578963dhf
#jpa選擇模式:create表示開發模式,每次啓動都會建立新的表格
#none表示結束模式
spring.jpa.hibernate.dll-auto = none
複製代碼
建立實體User類
做用:就是映射到數據庫,有點相似於Django框架中的Model的做用,講道理,Spring Boot框架相較於Django框架,至關不智能。
實現:
package com.mainpackage.webchat.model;
//做用:建立用戶類,包括了用戶名,密碼等等信息
import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
@Entity
public class User {
@Id
@GeneratedValue(strategy = GenerationType.AUTO)
private Integer id;
private String name;
private String email;
private String password;
//重寫toString方法
@Override
public String toString() {
return "{" +
" id='" + getId() + "'" +
", name='" + getName() + "'" +
", email='" + getEmail() + "'" +
", password='" + getPassword() + "'" +
"}";
}
public String getPassword() {
return this.password;
}
public void setPassword(String password) {
this.password = password;
}
public Integer getId() {
return this.id;
}
public void setId(Integer id) {
this.id = id;
}
public String getName() {
return this.name;
}
public void setName(String name) {
this.name = name;
}
public String getEmail() {
return this.email;
}
public void setEmail(String email) {
this.email = email;
}
}
複製代碼
實現增刪改查的接口:
建立UserRepository.java
文件,繼承於CrudRepository方法,實現接口
package com.mainpackage.webchat.model;
import java.util.List;
import org.springframework.data.repository.CrudRepository;
//接口 提供外部調用,方法自動生成
public interface UserRepository extends CrudRepository<User,Integer> {
List<User> findByEmail(String email);
void deleteByEmail(String email);
}
複製代碼