Java 是一种面向对象的编程语言，拥有广泛的应用领域。在Web开发中，Java 可以用于开发前端和后端应用程序。前端通常使用HTML、CSS和JavaScript来处理用户界面，后端则使用Java来处理业务逻辑和数据存储。下面我将详细介绍如何将Java前后端放在一起。

1. 构建前端应用

首先，我们需要构建一个前端应用，它通常由HTML、CSS和JavaScript组成。这里我以一个简单的登录表单为例。

<!-- index.html -->
<!DOCTYPE html>
<html>
<head>
    <title>登录</title>
</head>
<body>
    登录
    <form id="loginForm">
        <input type="text" id="username" placeholder="用户名">
        <input type="password" id="password" placeholder="密码">
        <button type="submit">登录</button>
    </form>
    <div id="message"></div>

    <script src="app.js"></script>
</body>
</html>

// app.js
document.getElementById("loginForm").addEventListener("submit", function(event) {
    event.preventDefault();

    var username = document.getElementById("username").value;
    var password = document.getElementById("password").value;

    // 发送登录请求
    fetch("/login", {
        method: "POST",
        headers: {
            "Content-Type": "application/json"
        },
        body: JSON.stringify({username: username, password: password})
    })
    .then(function(response) {
        if (response.ok) {
            return response.json();
        } else {
            throw new Error("登录失败");
        }
    })
    .then(function(data) {
        document.getElementById("message").textContent = "登录成功";
    })
    .catch(function(error) {
        document.getElementById("message").textContent = error.message;
    });
});

这是一个简单的HTML表单，当用户点击登录按钮时，通过JavaScript向后端发送登录请求，并根据响应结果更新页面显示。

2. 构建后端应用

接下来，我们需要构建一个后端应用，使用Java来处理登录请求。这里我使用Spring Boot框架来简化开发过程。

首先，我们需要一个控制器来处理登录请求。

import org.springframework.web.bind.annotation.*;

@RestController
public class LoginController {
    
    @PostMapping("/login")
    public String login(@RequestBody LoginForm form) {
        // 处理登录逻辑
        if (form.getUsername().equals("admin") && form.getPassword().equals("password")) {
            return "登录成功";
        } else {
            throw new RuntimeException("登录失败");
        }
    }
}

这是一个简单的控制器，使用@PostMapping注解将/login路径映射到login()方法。该方法接收一个LoginForm对象，其中包含了用户名和密码。在真实应用中，我们通常会将用户名和密码与数据库中的用户信息进行比对。

public class LoginForm {
    
    private String username;
    private String password;
    
    // 省略构造函数、getter和setter
}

LoginForm是一个简单的Java类，用于存储登录表单数据。它包含了用户名和密码字段。

然后，我们需要在应用启动时配置Spring Boot。

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

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

这是一个简单的启动类，使用@SpringBootApplication注解标识为Spring Boot应用程序的入口点。

3. 构建整体应用

现在，我们需要将前端和后端应用组合在一起。我们可以使用Maven等构建工具将它们打包成一个整体应用。

首先，确保前端应用的构建产物（例如编译后的HTML、CSS和JavaScript文件）位于后端应用的资源目录下。

- src
  - main
    - resources
      - static
        - index.html
        - app.js

然后，运行后端应用的main()方法启动整体应用。

在浏览器中访问http://localhost:8080，将会看到登录表单。当输入正确的用户名和密码并点击登录按钮时，将会显示登录成功。

结论

通过以上步骤，我们成功将Java前端和后端应用程序放在一起。前