nginx配置参考（/etc/nginx/sites-available路径下创建配置文件）

server {listen 80;  # 监听80端口server_name ip;  # 你的域名或IPlocation / {root /var/www/test_page/;index index.html;      # 默认文件try_files $uri $uri/ /index.html;  # 单页应用的路由支持}# 后端接口代理location /api/ {proxy_pass http://127.0.0.1:8080;  # 注意8080后不要加斜杠/proxy_http_version 1.1;proxy_set_header Host $host;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;add_header Access-Control-Allow-Origin *;add_header Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE";add_header Access-Control-Allow-Headers "Content-Type, Authorization";if ($request_method = 'OPTIONS') {add_header Access-Control-Allow-Origin *;add_header Access-Control-Allow-Methods "GET, POST, OPTIONS, PUT, DELETE";add_header Access-Control-Allow-Headers "Content-Type, Authorization";return 204;}}}

特别注意：proxy_pass的url后边带"/"会把 /system 给替换掉，也就是实际会直接访问http://127.0.0.1:8080/后的接口，而不是http://127.0.0.1:8080/system后的接口

golang后端代码示例

package mainimport ("encoding/json""log""net/http"
)type Response struct {Message string `json:"message"`
}func main() {// 创建一个路由处理器router := http.NewServeMux()router.HandleFunc("/api/hello", func(w http.ResponseWriter, r *http.Request) {w.Header().Set("Content-Type", "application/json")response := Response{Message: "Hello from Golang backend!"}json.NewEncoder(w).Encode(response)})// 直接使用路由处理器启动服务器log.Println("Starting server on :8080")if err := http.ListenAndServe(":8080", router); err != nil {log.Fatalf("Failed to start server: %v", err)}
}

前端代码示例

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Frontend Demo</title>
</head>
<body><h1>Frontend Demo</h1><button id="fetchButton">Fetch Message from Backend</button><p id="message"></p><script>document.getElementById('fetchButton').addEventListener('click', function() {fetch('/api/hello')  // 调用后端接口.then(response => {if (!response.ok) {throw new Error('Network response was not ok ' + response.statusText);}return response.json();  // 解析 JSON 响应}).then(data => {document.getElementById('message').innerText = data.message;  // 显示消息}).catch(error => {console.error('Error:', error);document.getElementById('message').innerText = 'Failed to fetch message: ' + error.message;});});</script>
</body>
</html>