Golang의 브라우저 지원: 대화형 웹 구축

go mod init myapp

package main

import (
    "fmt"
    "net/http"
)

func main() {
    // 定义一个处理程序函数，它将在浏览器中渲染一个简单的消息
    http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
        fmt.Fprintf(w, "Hello from Go!")
    })

    // 启动 HTTP 服务器侦听端口 8080 上的请求
    http.ListenAndServe(":8080", nil)
}

go run main.go

    // 创建一个简单表单，包含一个输入字段和一个提交按钮
    fmt.Fprintf(w, "<form method='POST'><input type='text' name='message'/><input type='submit' value='Send'/></form>")

const form = document.querySelector('form');

form.addEventListener('submit', (e) => {
    e.preventDefault();
    const message = e.target.querySelector('input[name="message"]').value;

    // 使用 Fetch API 发送 POST 请求
    fetch('/', {
        method: 'POST',
        body: JSON.stringify({ message }),
        headers: {
            'Content-Type': 'application/json'
        }
    })
    .then(res => res.json())
    .then(data => {
        // 处理服务器响应
        console.log(data);
    })
    .catch(error => {
        // 处理错误
        console.log(error);
    });
});

func main() {
    http.HandleFunc("/", func(w http.ResponseWriter, r *http.Request) {
        if r.Method == "POST" {
            // 解析 JSON 请求正文
            var msg Message
            decoder := json.NewDecoder(r.Body)
            if err := decoder.Decode(&msg); err != nil {
                http.Error(w, err.Error(), http.StatusBadRequest)
                return
            }

            // 处理消息并返回响应
            fmt.Fprintf(w, "Got your message: %s", msg.Message)
        } else {
            // 处理其他请求方法
        }
    })

    // 定义一个用于保存消息的类型
    type Message struct {
        Message string `json:"message"`
    }

    http.ListenAndServe(":8080", nil)
}