Spring Boot入门指南：留言板

作者：System 时间：2024年09月04日分类：所有,java 字数：2034

以下是一个简单的Spring Boot留言板示例，包括后端API和前端页面。

后端API（Controller）:




import org.springframework.web.bind.annotation.*;
import java.util.List;
import java.util.ArrayList;
 
@RestController
@RequestMapping("/api/guestbook")
public class GuestbookController {
 
    private static final List<Message> messages = new ArrayList<>();
 
    @GetMapping
    public List<Message> getAllMessages() {
        return messages;
    }
 
    @PostMapping
    public Message addMessage(@RequestBody Message message) {
        message.setId((int) (messages.size() + 1));
        messages.add(message);
        return message;
    }
 
    static class Message {
        private int id;
        private String content;
 
        // standard getters and setters
        public int getId() {
            return id;
        }
 
        public void setId(int id) {
            this.id = id;
        }
 
        public String getContent() {
            return content;
        }
 
        public void setContent(String content) {
            this.content = content;
        }
    }
}

前端页面（HTML）:




<!DOCTYPE html>
<html>
<head>
    <title>Simple Guestbook</title>
</head>
<body>
    <h1>Simple Guestbook</h1>
    <form action="/api/guestbook" method="post">
        <textarea name="content" rows="4" cols="50"></textarea>
        <input type="submit" value="Submit">
    </form>
    <hr>
    <h2>Messages</h2>
    <ul id="messages">
        <!-- messages are dynamically loaded here -->
    </ul>
 
    <script>
        function loadMessages() {
            fetch('/api/guestbook')
                .then(response => response.json())
                .then(messages => {
                    const messageList = document.getElementById('messages');
                    messageList.innerHTML = ''; // clear current messages
                    messages.forEach(message => {
                        const listItem = document.createElement('li');
                        listItem.textContent = message.content;

Spring Boot入门指南：留言板

评论已关闭

推荐阅读