关于springboot完整创建一个简单的前后端交互项目

1、首先创建一个springboot项目

1
2
3
4
5

2、项目创建完成

1、项目初始目录

在这里插入图片描述

2、尽量设置为自己的maven配置

在这里插入图片描述

3、添加依赖

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
            <version>2.5.0</version>
        </dependency>

4、在项目中创建了这两个文件

static目录

先增
IndexController

package com.wei.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 * @Author wei
 * @Date 2022/6/1 21:02
 * @Version 1.0
 */
@Controller
@RequestMapping("/")
public class IndexController {

    @GetMapping
    public String index(){

        return "index.html";
    }
}

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <h1>Hello,World!</h1>
</body>
</html>

3、启动项目

打开浏览器访问地址:
1、 http://localhost:8080/
2、http://localhost:8080/index.html 直接访问
上面两个地址都可以访问访问
在这里插入图片描述

templates目录(动态)

1、添加依赖

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

2、在resources建立目录

在这里插入图片描述
hello.html

<!DOCTYPE html>
<html lang="en" >
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
  <h1> hello,wei!</h1>
</body>
</html>

3、修改indexController文件

package com.wei.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;

/**
 * @Author wei
 * @Date 2022/6/1 21:02
 * @Version 1.0
 */
@Controller
@RequestMapping
public class IndexController {

    @GetMapping("/")
    public String index(){

        return "index.html";
    }
    
    @GetMapping("/hellodemo")
    public String hello(){
        return "hello";
    }
}

访问地位为:http://localhost:8080/hellodemo
动态页面不能直接访问

总结

静态页面的return默认是跳转到/static/目录下,当在pom.xml中引入了thymeleaf组件,动态跳转会覆盖默认的静态跳转,默认就会跳转到/templates/下,注意看两者return代码也有区别,动态没有html后缀。


版权声明:本文为qq_36191374原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。