最简动态加载方案是go后端用net/http提供json接口并设置cors和content-type头,前端用fetch请求并更新dom;需复用http.client、避免模板实时绑定、优先返回结构化数据而非html片段。
用 net/http + 前端 fetch 实现最简动态加载
Go 本身不直接渲染 HTML 或操作 DOM,所谓“动态内容加载”本质是后端提供数据接口、前端发起请求并更新页面。最轻量的做法就是写一个返回 JSON 的 HTTP handler,配合前端用 fetch 拉取并插入内容。
常见错误是试图在 Go 模板里做轮询或监听——模板只在服务端渲染一次,无法响应后续用户交互。
- 后端只需定义一个
http.HandleFunc("/api/content", ...),返回map[string]interface{}并用json.NewEncoder(w).Encode(...)输出 - 前端用
fetch("/api/content").then(r => r.json()).then(data => {...})更新innerHTML或textContent - 注意设置响应头:
w.Header().Set("Content-Type", "application/json; charset=utf-8"),否则中文可能乱码
避免 CORS 报错:Go 后端要显式允许跨域
本地开发时前端跑在 http://localhost:5173,Go 后端在 :8080,浏览器会拦截请求并报 CORS policy: No 'Access-Control-Allow-Origin' header。
这不是前端写错了,而是 Go HTTP handler 没回传必要头信息。