搭建Springboot框架

一.安装software,配置jdk和tomcat

  1. Idea
  2. Navicat for MySQL
  3. phpstudy_pro
  4. 配置JDK和Tomcat

二.Create project

A.导入Springboot模板

搭建Springboot框架_第1张图片打开Idea,进行new project 操作

搭建Springboot框架_第2张图片选中要下载的框架,然后选择下一步

搭建Springboot框架_第3张图片填写完项目名称和路径,就可以直接点击完成

搭建Springboot框架_第4张图片
创建完框架后,首先在右下角弹出的maven消息中,点击Import Changes,导入依赖

搭建Springboot框架_第5张图片
到了这一步,说明你已经完成搭建Springboot框架,熟悉一下结构目录

B.构建第一个Java Web程序

搭建Springboot框架_第6张图片
在com.zc.demo目录下创建controller,mapper,pojo,service四个包

搭建Springboot框架_第7张图片
将application.preperties的后缀改为yml格式,yml格式层级更清晰,方便我们查看
搭建Springboot框架_第8张图片
填写基础的配置信息,比如tomcat运行的端口、数据库的配置等

搭建Springboot框架_第9张图片
点击右上角启动按钮,控制台出现如下的情况就是启动成功了

搭建Springboot框架_第10张图片
在controller文件夹中创建一个Test类

搭建Springboot框架_第11张图片
编写程序,然后启动项目

搭建Springboot框架_第12张图片
打开浏览器输入接口地址,看见返回对应字符串。第一个Java Web程序完成

C. 整合mybatis数据库框架

在application.yml文件中添加Mybatis配置:

> mybatis:
>      mapper-locations: classpath:mapper/*.xml  	 //填写mapper映射路径
>      type-aliases-package: com.zc.demo.pojo		 //填写实体类路径

在pom.xml下添加mybatis—generator必要依赖,等待下载完成
搭建Springboot框架_第13张图片

mybatis——generator必要依赖(注意格式)

<!--  mybatis逆向工程 2020年02月06日20:14:01          -->
            <plugin>
                <groupId>org.mybatis.generator</groupId>
                <artifactId>mybatis-generator-maven-plugin</artifactId>
                <version>1.3.2</version>
                <configuration>
                    <!--配置文件的位置-->
                    <configurationFile>src/main/resources/generatorConfig.xml</configurationFile>
                    <verbose>true</verbose>
                    <overwrite>true</overwrite>
                </configuration>
                <executions>
                    <execution>
                        <id>Generate MyBatis Artifacts</id>
                        <goals>
                            <goal>generate</goal>
                        </goals>
                    </execution>
                </executions>
                <dependencies>
                    <dependency>
                        <groupId>org.mybatis.generator</groupId>
                        <artifactId>mybatis-generator-core</artifactId>
                        <version>1.3.2</version>
                    </dependency>
                </dependencies>
            </plugin>

在resources目录创建一个generatorConfig.xml,注意填入框架参数
搭建Springboot框架_第14张图片

框架参数如下(参数中的数据表名和路径都得修改)

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE generatorConfiguration
        PUBLIC "-//mybatis.org//DTD MyBatis Generator Configuration 1.0//EN"
        "http://mybatis.org/dtd/mybatis-generator-config_1_0.dtd">
<generatorConfiguration>
    <!--mysql 连接数据库jar 这里选择自己本地位置-->
    <classPathEntry location="/Users/zc/.m2/repository/mysql/mysql-connector-java/8.0.19/mysql-connector-java-8.0.19.jar" />
    <context id="testTables" targetRuntime="MyBatis3">
        <commentGenerator>
            <!-- 是否去除自动生成的注释 true:是 : false:否 -->
            <property name="suppressAllComments" value="true" />
        </commentGenerator>
        <!--数据库连接的信息:驱动类、连接地址、用户名、密码 -->
        <jdbcConnection driverClass="com.mysql.jdbc.Driver"
                        connectionURL="jdbc:mysql://localhost:3306/demo" userId="root"
                        password="Zc-1995-0513">
            <property name="nullCatalogMeansCurrent" value="true"/>
        </jdbcConnection>
        <!-- 默认false,把JDBC DECIMAL 和 NUMERIC 类型解析为 Integer,为 true时把JDBC DECIMAL 和
           NUMERIC 类型解析为java.math.BigDecimal -->
        <javaTypeResolver>
            <property name="forceBigDecimals" value="false" />
        </javaTypeResolver>
        <!-- targetProject:生成PO类的位置 -->
        <javaModelGenerator targetPackage="com.zc.demo.generator.pojo"
                            targetProject="src/main/java">
            <!-- enableSubPackages:是否让schema作为包的后缀 -->
            <property name="enableSubPackages" value="false" />
            <!-- 从数据库返回的值被清理前后的空格 -->
            <property name="trimStrings" value="true" />
        </javaModelGenerator>
        <!-- targetProject:mapper映射文件生成的位置
           如果maven工程只是单独的一个工程,targetProject="src/main/java"
           若果maven工程是分模块的工程,targetProject="所属模块的名称",例如:
           targetProject="ecps-manager-mapper",下同-->
        <sqlMapGenerator targetPackage="com.zc.demo.generator.mapper"
                         targetProject="src/main/java">
            <!-- enableSubPackages:是否让schema作为包的后缀 -->
            <property name="enableSubPackages" value="false" />
        </sqlMapGenerator>
        <!-- targetPackage:mapper接口生成的位置 -->
        <javaClientGenerator type="XMLMAPPER"
                             targetPackage="com.zc.demo.generator.mapper"
                             targetProject="src/main/java">
            <!-- enableSubPackages:是否让schema作为包的后缀 -->
            <property name="enableSubPackages" value="false" />
        </javaClientGenerator>
        <!-- 指定数据库表 -->
        <table schema="" tableName="user"></table>
    </context>
</generatorConfiguration>

还得将对应的路径填入(点击如图深蓝色的按钮)
搭建Springboot框架_第15张图片
检查接口,数据表等是否错误
搭建Springboot框架_第16张图片

修改路径还有数据表名称(还有问题自行百度找错误)
在这里插入图片描述

打开左侧maven工具栏,选择Plugins中的 Maven-generator 双击运行,开始自动生成代码

将generato生成的实体类、接口和xml映射文件分别放到指定的包中
搭建Springboot框架_第17张图片

在启动类中加上@MapperScan注解,指定实现类接口所在的包
搭建Springboot框架_第18张图片

在controller文件夹下的test类中输入以下代码
搭建Springboot框架_第19张图片
运行程序,出现图下字符串,则表示连接数据库成功
搭建Springboot框架_第20张图片
三.Springboot项目模板构建完成
注:
1.可在Test类中写方法,调用数据库信息,进行前后端交互
2.后端技术,例如 thymeleaf、Session
3.Conclusion

四.注册

1.在templates文件下新建一个index.html
搭建Springboot框架_第21张图片
添加以下Html代码(前端页面的布局可自由发挥)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>主页</title>
</head>
<body>
<center><h3 style="font-size: small">login</h3></center>
</br>
<form id="msg">
    <center><input style="font-size: small" name="username" type="text" placeholder="请输入用户名"></center>
    </br>
    <center><input style="font-size: small" name="password" type="password" placeholder="请输入密码"></center>
    </br>
    <center><input style="font-size: small" name="mails" type="text" placeholder="请输入邮箱"></center>
    </br>
    <center><input style="font-size: small;" name="code" type="text" placeholder="请输入验证码"></center>
    </br>
    <center><input style="size: 120px;font-size: small" id="register" type="button" value="注册">  <input style="size: 100px;font-size: small" id="getCode" type="button" value=" 获取验证码"></center>
</form>
</br>
<input type="button" value="登陆">
<input id="select" type="button" value="查询">
<input type="button" value="删除">
</body>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
    <!--    注册功能    -->
    $('#register').click(function () {
        // alert("我注册了");
        //    .ajax
        $.ajax({![在这里插入图片描述](https://img-blog.csdnimg.cn/20200603203202773.png)
            url : "/test/register",
            data :$('#msg').serialize(),
            success :function (data) {
                alert(data);
            }
        })
    })
    //获取验证码
    $('#getCode').click(function () {
        $.ajax({
            url:"/GetCodeController/getCodeController",
            data :$('#msg').serialize(),
            success:function (data) {
                if(data=== "success"){
                    alert("获取验证码成功");
                }
            }
        })
    })
    //查询
    $('#select').click(function () {
        $.ajax({
            url:"/test/selectAll",
            data:$('#msg').serialize(),
            success:function (data) {
                if(data==="success")
                    alert("查询成功");
            }
        })
    })
</script>
</html>

2.分别在controller文件下新建GetCodeController、GotoPage两个类
搭建Springboot框架_第22张图片

3.在GotoPage类中添加访问路径
搭建Springboot框架_第23张图片

在GetCodeController类下验证码添加判断语句

package com.example.demo.controller;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.HttpRequest;
import org.springframework.mail.SimpleMailMessage;
import org.springframework.mail.javamail.JavaMailSender;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import  javax.servlet.http.HttpServletRequest;
import java.security.PublicKey;

@Controller
@RequestMapping("/GetCodeController")
public class GetCodeController {
      //获得验证码
     // session
      private String from;
     @Autowired
     private JavaMailSender mailSender;
     Logger logger = LoggerFactory.getLogger(this.getClass());
     @RequestMapping("/getCodeController")
     @ResponseBody
     public String getCodeController(HttpServletRequest request,String mailAddress){
          //生成验证码
          int code=(int)( (Math.random() * 9 + 1) * 100000);
          int yzm=code;
          String str="";
          str+=yzm/100000%10;
          str+=yzm/10000%10;
          str+=yzm/1000%10;
          str+=yzm/100%10;
          str+=yzm/10%10;
          str+=yzm%10;
          //邮箱获取送验证码
          SimpleMailMessage message = new SimpleMailMessage();
          String str1=request.getParameter("mails");
               message.setFrom("[email protected]"); //发送人
               message.setTo(str1);   //收件人
               message.setSubject("邮箱验证");  //邮件名
               message.setText("你的注册码是 "+str);   //邮件内容(验证码)
               mailSender.send(message);
               logger.info("已经发送");
               //通过request对象来创建session
               //通过键值对的方式来进行储存
               request.getSession().setAttribute("code",code);
               //System.out.println(code);
               System.out.println(request.getSession().getAttribute("code"));
               return "success";
     }
}

4.在application.yml文件中进行配置(注意仔细检查参数)
搭建Springboot框架_第24张图片
5.此时说明数据库已连接完成,可以尝试运行了
搭建Springboot框架_第25张图片
6.调试运行

a.出现这个弹窗,说明你可以实现验证码功能

搭建Springboot框架_第26张图片
b.在后端也能看到你发送的邮箱验证码
搭建Springboot框架_第27张图片
c.可以发现接收者的邮箱里收到了验证码的信息
搭建Springboot框架_第28张图片
7.User中写上注册功能(数据库表插入数据)

@Resource
private UserMapper userMapper;
@RequestMapping("/index")
@ResponseBody
public String Index(){
     UserExample userExample=new UserExample();
     user.setUserName("字符串");
     userMapper.insert(user);
}

8.点击注册,出现success即表示成功注册
搭建Springboot框架_第29张图片
Over !!!!

你可能感兴趣的:(Springboot,前端,java,spring,boot)