返回

从零开始打造Spring Boot+Vue3整合项目:后端篇

后端

用 Spring Boot 和 Vue.js 构建一个完整的 Web 应用程序:后端指南

搭建项目

创建 Spring Boot 项目的第一步是使用 Spring Initializr,它是一个在线工具,可以帮助您快速启动一个新的 Spring Boot 项目。在“Dependencies”部分,选择以下依赖:

  • Spring Web
  • Spring Data JPA
  • MySQL Driver
  • Spring Security

创建实体类

实体类表示我们的数据模型。我们需要一个 User 实体类来存储用户数据:

// 省略其他导入

@Entity
public class User {

    @Id
    @GeneratedValue(strategy = GenerationType.AUTO)
    private Long id;

    private String username;

    private String password;

}

创建 Repository

Repository 用于处理数据访问:

// 省略其他导入

public interface UserRepository extends JpaRepository<User, Long> {

}

创建 Controller

Controller 用于处理 HTTP 请求:

// 省略其他导入

@RestController
@RequestMapping("/api/users")
public class UserController {

    @Autowired
    private UserRepository userRepository;

    @PostMapping
    public User createUser(@RequestBody User user) {
        return userRepository.save(user);
    }

    @GetMapping
    public List<User> getAllUsers() {
        return userRepository.findAll();
    }

}

启动项目

最后,我们需要一个主类来启动 Spring Boot 项目:

// 省略其他导入

@SpringBootApplication
public class DemoApplication {

    public static void main(String[] args) {
        SpringApplication.run(DemoApplication.class, args);
    }

}

实现业务逻辑

用户注册

@PostMapping
public User createUser(@RequestBody User user) {
    return userRepository.save(user);
}

用户登录

@GetMapping
public List<User> getAllUsers() {
    return userRepository.findAll();
}

单元测试

为了确保我们的代码正确无误,我们需要编写单元测试:

// 省略其他导入

@SpringBootTest
@AutoConfigureMockMvc
public class UserControllerTest {

    @Autowired
    private MockMvc mockMvc;

    @Test
    public void shouldCreateUser() throws Exception {
        String userJson = "{\"username\": \"user1\", \"password\": \"password1\"}";

        mockMvc.perform(post("/api/users")
                .contentType(MediaType.APPLICATION_JSON)
                .content(userJson))
                .andExpect(status().isOk());
    }

}

参数校验

使用 Spring Validation 来进行参数校验:

import javax.validation.Valid;

@PostMapping
public User createUser(@Valid @RequestBody User user) {
    return userRepository.save(user);
}
public class User {

    @NotNull
    private String username;

    @NotNull
    @Size(min = 8)
    private String password;

}

部署项目

部署项目的常见方法包括:

  • 使用 JAR 包部署
  • 使用 Docker 部署
  • 使用 Kubernetes 部署

总结

在本文中,我们介绍了如何使用 Spring Boot 和 Vue.js 构建一个完整的 Web 应用程序的后端部分。我们涵盖了搭建项目、实现业务逻辑、单元测试、参数校验和部署项目等各个方面。

常见问题解答

  1. 什么是 Spring Boot?
    Spring Boot 是一个 Java 框架,用于快速创建和运行应用程序。它简化了 Spring 应用程序的配置和开发过程。

  2. 什么是 Vue.js?
    Vue.js 是一个 JavaScript 框架,用于构建用户界面。它是一个渐进式的框架,这意味着您可以根据需要逐步添加功能。

  3. 如何部署 Spring Boot 应用程序?
    您可以使用 JAR 包部署、Docker 部署或 Kubernetes 部署等多种方法来部署 Spring Boot 应用程序。

  4. 如何进行单元测试?
    您可以使用 Spring Boot Test 和 JUnit 等框架来进行单元测试。

  5. 如何进行参数校验?
    您可以使用 Spring Validation 来进行参数校验。