项目部署至服务器 :如何在Nginx反向代理中将HTTP/HTTPS混合请求处理?让我来看看~

1、问题导向

先来简单介绍一下项目背景,在一个三端(两个管理员网页端+小程序端)项目中遇到的问题:

(1)项目架构

  • 两个管理员网页端(HTTP)
  • 一个小程序端(需要HTTPS)
  • 后端服务(小程序要求HTTPS,所以需要部署域名,配置了SSL)

(2)具体问题

  • 小程序端:需要HTTPS,已配置域名并正常工作
  • 管理员网页端:使用HTTP,通过IP访问
  • 当后端配置SSL后,网页端请求报错400 (Bad Request)

2、错误信息

复制代码
POST http://[服务器ip]:5174/api/admins/login 400 (Bad Request)
Request failed with status code 400

3、解决方案

在Nginx配置文件中,修改反向代理配置:

复制代码
location /api/ {
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header REMOTE-HOST $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    # 1.添加一行
    proxy_set_header X-Forwarded-Proto $scheme;  # 标识原始协议类型
    # 2.将http改为https
    proxy_pass https://[服务器ip]:8090/;  
}

4、原理解析

(1)Nginx反向代理的协议转换机制

  • 客户端(浏览器)发送HTTP请求到Nginx
  • Nginx将请求转换为HTTPS并转发到后端服务器
  • 整个转换过程对客户端透明

(2)请求流程

|--------------------------------------|
| 客户端(HTTP) -> Nginx -> 后端服务器(HTTPS) |

  • 前端页面:发起HTTP请求
  • Nginx:将请求升级为HTTPS
  • 后端:接收HTTPS请求并处理

这样Nginx就承担了协议转换的角色,前端到Nginx:HTTP通信,Nginx到后端:HTTPS通信 。保证了后端通信安全性的同时不影响前端访问。

5、总结

这就是为什么当操作页面发送请求的时候,在网络面板看到HTTP请求,但系统仍然能正常工作的原因。nginx在这里扮演了一个协议转换器的角色,使得前端可以继续使用HTTP,而后端则确保了HTTPS的安全性。

相关推荐
tryCbest8 小时前
Vue3项目在Nginx中配置代理后端IP
nginx·vue3
躺不平的理查德8 小时前
ARCH与交叉编译器的关系
服务器·arm
就叫飞六吧9 小时前
DeepSeek Harness 本地安装与启动指南
nginx
谢慧琼10 小时前
2026零基础做企业网站,低成本搭建官方网站
服务器·前端·javascript
世人万千丶13 小时前
去重插入与超限淘汰:ArkTS 实现鸿蒙搜索历史的 LIMIT 艺术
运维·服务器·学习·华为·harmonyos·鸿蒙
程序员与背包客_CoderZ14 小时前
Linux D-Bus通信协议详解:从入门到C/C++编码实战
linux·服务器·c语言·c++·嵌入式硬件·嵌入式软件·dbus
Android系统攻城狮14 小时前
Linux PipeWire深度解析之pw_properties_iterate调用流程与实战(六十五)
linux·运维·服务器·音频进阶·pipewire音频进阶
難釋懷15 小时前
Nginx主动健康检查
运维·nginx
ITyunwei098715 小时前
内存溢出报错,实战处理记录
运维·服务器·企业微信
谷哥的小弟16 小时前
腾讯云服务器安装Redis Stack图文教程
服务器·redis·腾讯云·redis stack