NGINX反向代理golang后端服务

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

bash 复制代码
server {
    listen 80;  # 监听80端口
    server_name ip;  # 你的域名或IP

    location / {
    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后端代码示例

bash 复制代码
package main

import (
    "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)
    }
}

前端代码示例

bash 复制代码
<!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>

测试

点击按钮出现Hello from Golang backend!表示代理成功