自学内容网 自学内容网

IDEA2019搭建Springboot项目基于java1.8 解决Spring Initializr无法创建jdk1.8项目 注释乱码

后端界面搭建

新建
在这里插入图片描述
在这里插入图片描述
将 https://start.spring.io/ 替换https://start.aliyun.com/
在这里插入图片描述

报错
在这里插入图片描述
打开设置
在这里插入图片描述
修改如下在这里插入代码片
在这里插入图片描述
按此方法无果 翻阅治疗后得知 IDEA2019无法按照网上教程修改此问题因此更新最新idea2024或利用插件Alibaba Clouod Toolkit

在这里插入图片描述

换用IDEA2024创建项目

在这里插入图片描述
下一步后进入如下界面
在这里插入图片描述
添加相关依赖
在这里插入图片描述
创建后maven项目如下
在这里插入图片描述
添加相关配置yml
项目默认的配置文件为application.properties ,properties配置文件属于早期,也是目前创建 Spring Boot(2.x)项目时默认的配置文件格式。目前普遍流行使用.yml进行配置文件设置。

yml 可以看做是对 properties 配置文件的升级,属于 Spring Boot 的“新版”配置文件。它具有语法更简洁、可读性更高、更好配置多种数据类型、跨语言、通用性强等优点。

在这里插入图片描述
在这里插入图片描述
在更换IDEA2024后发现注释乱码因此需要进行配置修改
本项目修改
在这里插入图片描述
创建项目前修改
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
修改后
在这里插入图片描述

server:
  port: 8080
spring:
  datasource:
    username: root
    password: root
    #url中database为对应的数据库名称,这里为class
    url: jdbc:mysql://localhost:3306/class?useUnicode=true&characterEncoding=utf-8&useSSL=true&serverTimezone=UTC
    driver-class-name: com.mysql.cj.jdbc.Driver
  thymeleaf:
    prefix: classpath:/templates/
    suffix: .html
    cache: false
mybatis-plus:
  configuration:
    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl

注意:#url中database为对应的数据库名称,这里为class,大家可以根据自己实际的数据库名称进行修改即可。

添加后端测试依赖thymeleaf依赖

基于VUE和Springboot做开发前后端分离管理系统的时候就不要hymeleaf做html页面,目前因为我们还在内测后端环境,所以在项目中创建html页面。故添加thymeleaf依赖。

<dependency>
    <groupId>org.springframework.boot</groupId>
    <artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>

在这里插入图片描述

修改IDEA仓库位置

因为一般情况下要修改仓位置因此本文使用博主安装的仓库
在这里插入图片描述
设置完如图所示
在这里插入图片描述

测试

在如图所示文件夹下建立文件包和UserController.java文件并添加代码。
在这里插入图片描述
代码如下:

    @Controller
    public class UserContrller {
        @RequestMapping("/test")
        public String login(){
            return "main.html";
        }
    }

在resource文件夹下建立如图所示文件夹以及文件
在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试</title>
</head>
<body>
     <h1>测试</h1>
</body>
</html>

运行
在这里插入图片描述
在这里插入图片描述
测试发现与yml配置端口号不一致
原因仅运行html文件,应运行springboot启动项
在这里插入图片描述
端口对但报错
在这里插入图片描述
仔细检查发现是代码中有写了个重复userController修改后为:


@Controller
public class UserController {
        @RequestMapping("/test")
        @ResponseBody
        public String login(){
            return "main.html";
        }

}

在这里插入图片描述
代码成功但是页面未引入,因此检查发现依赖下载位置不对应在<dependencyManagement>上方加粗样式
加粗样式在这里插入图片描述

去掉responsbody
@Controller
public class UserController {
        @RequestMapping("/test")
     
        public String login(){
            return "main.html";
        }

}

在这里插入图片描述
自此基本框架搭建完毕

测试前后端传值

后端向前端传值
代码内添加
在这里插入图片描述
后端:

 @GetMapping("/")
    /*Map方式
    public String index(Map<String, Object> map){
        map.put("msg", "Hello, Spring Boot!");
        return "login.html";
    }*/
    /*Model 方式*/
    public String index(Model model){
        model.addAttribute("msg", "Hello 同学"); //向前端传递
        return "login.html";
    }

前端
在这里插入图片描述

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
</head>
<body>
<h1>登录</h1>
<span th:text="${msg}"></span> <!-- 后端传递过来的值-->
</body>
</html>

地址栏输入:http://localhost:8080/,回车。

在这里插入图片描述
前端向后端传值
修改login.html代码
在这里插入图片描述

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>欢迎登录</title>
    <link rel="shortcut icon" href="#">
</head>
<body>
<form action="login" method="post">
    <table>
        <span th:text="${msg}"></span>
        <tr>
            <td>用户名: </td>
            <td>
                <input  type="text" name="username"/>
            </td>
        </tr>
        <tr>
            <td>密码: </td>
            <td>
                <input  type="password" name="password"/>
            </td>
        </tr>
        <tr>
            <td>
                <input  type="submit" value="登录"/>
            </td>
        </tr>
    </table>
</form>
</body>
</html>

后端添加

    @PostMapping("/login")
    public String login(String username, String password) {
        System.out.println("用户名是:"+username+"密码是:"+password);
        return "main.html";
    }

运行程序
地址栏输入:http://localhost:8080/,回车。
在这里插入图片描述
用户名输入222 密码输入222 点击登录,查看后台显示
在这里插入图片描述
成功前后台都可传递。


原文地址:https://blog.csdn.net/qq_41739657/article/details/143917244

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!