nginx 反向代理

adong搬砖發表於2024-08-12
Nginx
nginx.conf

http {
　　
 server {
        listen       80;
        server_name  localhost;

        location ^~ /api {
            root   html;
            index  index.html;  
            proxy_pass  http://localhost:5000/api;#前面加http
            proxy_redirect     off;
            proxy_set_header   Host             $host;        # 傳遞域名
            proxy_set_header   X-Real-IP        $remote_addr; # 傳遞ip
            proxy_set_header   X-Scheme         $scheme;      # 傳遞協議
            proxy_set_header   X-Forwarded-For  $proxy_add_x_forwarded_for;
        }

        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
}

　　

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <button onclick="send()">send</button>

  <script>
    const send = () => {
      const xhr = new XMLHttpRequest()
      xhr.open('get', 'http://localhost/api/getData')
      xhr.send()
      xhr.onload = () => {
        console.log(xhr.responseText)
      }
    }
  </script>
</body>
</html>

　　

相關文章