Nginx HTTPS代理大文件加载失败的排查与解决方案

 更新时间:2025年12月17日 08:22:51   作者:枫叶梨花  
本文基于一次生产环境中的实际案例,详细解析了Nginx代理配置不当导致HTTPS访问下前端资源加载失败的问题,通过日志分析、参数调优和原理说明,为开发者提供完整的排查思路与解决方案,需要的朋友可以参考下

一、问题背景

今日运维人员告知我,突然网站的登录页访问变白屏,我登录后台发现服务一切正常,Nginx也正常运行,我尝试访问网站登录页,并连点十几次会访问正常,之后就会正常,但是登录以后也会某些页面存在白屏状态,查看浏览器请求发现某些JS、CSS文件没有正常返回,Nginx的访问日志出现206等问题,想到前几天刚续费了HTTPS的域名证书,证书也换过了,然后切换到内网HTTP发现正常,猜想应该是Nginx中的HTTPS的配置有问题,缓存类配置可能存在问题。

二、问题现象

总结出现以下异常:

  • HTTPS访问登录页白屏,连续刷新20次后偶现正常;
  • HTTP内网访问正常,无异常;
  • 浏览器开发者工具显示:大体积JS文件(如chunk-vendors.js)加载失败,状态码为206 Partial Content
  • Nginx访问日志记录:
10.xx.xxx.90 - - 443 [25/Oct/2025:17:40:20 +0800] 
  "GET /js/chunk-vendors.6112ac08.js HTTP/1.1" 206 1 
  "https://xxxx/login" 
  "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36"

三、问题定位与根因分析

1. 核心问题:Nginx代理缓冲区不足

(1)Nginx代理工作原理

当Nginx作为反向代理时,其处理上游响应的流程如下:

  1. 接收后端服务返回的响应数据;
  2. 将数据缓存到内存缓冲区中;
  3. 若缓冲区不足,则将数据写入临时文件(proxy_max_temp_file_size控制);
  4. 最终将数据发送给客户端(浏览器)。

(2)默认配置的限制

Nginx默认配置的缓冲区大小为:

proxy_buffer_size 4k|8k;        # 响应头缓冲区
proxy_buffers 8 4k|8k;          # 响应体缓冲区(数量 × 大小)
proxy_busy_buffers_size 8k|16k; # 忙碌时可发送的最大缓冲区
  • 总缓冲容量8 × 4k = 32KB,不足以承载1~2MB的前端资源;
  • HTTPS加重问题:TLS加密/解密消耗更多CPU资源,导致缓冲区更容易被撑满;
  • 206状态码的含义Partial Content,表示响应未完整传输,Nginx在临时文件写入过程中可能因超时或中断导致加载失败。

(3)为何HTTP正常?

HTTP无需加密,Nginx处理速度更快,缓冲区在短时间内能完成数据传输,因此未触发问题。

四、解决方案与配置说明

1. 调整Nginx代理缓冲区参数

在Nginx配置文件的http块中添加以下配置:

# 增加内存缓冲区大小,避免写入临时文件
proxy_buffer_size 128k;         # 存储响应头(含Cookie/CSP等)
proxy_buffers 32 128k;          # 存储响应体(32 × 128k = 4MB)
proxy_busy_buffers_size 128k;   # 忙碌时最大发送缓冲区

参数详解:

参数作用推荐值说明
proxy_buffer_size响应头缓冲区128k确保大头信息(如Cookie、CSP)完整加载
proxy_buffers响应体缓冲区32 × 128k总容量4MB,覆盖常见前端资源大小
proxy_busy_buffers_size忙碌时发送缓冲区128k避免缓冲区争用导致发送中断

生效范围:配置应放在http块中全局生效,或针对特定server/location块。

2. 重载Nginx配置

# 检查配置语法
sudo nginx -t

# 重载配置
sudo nginx -s reload

五、验证与测试

清除浏览器缓存之后重新访问,一切正常,问题解决。

到此这篇关于Nginx HTTPS代理大文件加载失败的排查与解决方案的文章就介绍到这了,更多相关Nginx HTTPS代理大文件加载失败内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Nginx日志打印自定义请求头的实战

    Nginx日志打印自定义请求头的实战

    nginx的日志可以打印很多内容,但是有时候自定义的请求头该怎么打印呢,本文就来介绍一下,感兴趣的可以了解一下
    2024-12-12
  • Nginx之https证书配置实现

    Nginx之https证书配置实现

    本文主要介绍了Nginx之https证书配置的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2025-12-12
  • nginx的location的优先级和匹配方式

    nginx的location的优先级和匹配方式

    location是Nginx中的块级指令,本文主要介绍了nginx的location的优先级和匹配方式,具有一定的参考价值,感兴趣的可以了解一下
    2023-10-10
  • nginx 常用指令 try_files allow root alias的使用

    nginx 常用指令 try_files allow root ali

    本文主要介绍了nginx 常用指令 try_files allow root alias的使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2024-08-08
  • 使用Nginx搭建图片服务器(windows环境下)

    使用Nginx搭建图片服务器(windows环境下)

    这篇文章主要介绍了使用Nginx搭建图片服务器(windows环境下),小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-06-06
  • nginx设置资源缓存实战详解

    nginx设置资源缓存实战详解

    这篇文章主要介绍了nginx设置资源缓存实战详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-10-10
  • nginx禁止dedecms目录php执行权限

    nginx禁止dedecms目录php执行权限

    nginx禁止dedecms目录php执行权限,找到配置fastcgi.conf文件,一般在/usr/local/nginx/conf/下面,修改如下
    2014-01-01
  • Nginx中root和alias指令的使用与区别

    Nginx中root和alias指令的使用与区别

    root和alias是两个重要但经常令人混淆的指令,尤其用于指定资源在服务器文件系统中的位置,本文就来介绍一下两个指令的使用与区别,感兴趣的可以了解一下
    2024-08-08
  • Ansible批量部署Nginx的示例代码

    Ansible批量部署Nginx的示例代码

    这篇文章主要介绍了Ansible批量部署Nginx的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-10-10
  • Nginx服务器基本的模块配置和使用全攻略

    Nginx服务器基本的模块配置和使用全攻略

    这篇文章主要介绍了Nginx服务器基本的模块配置和使用全攻略,从Nginx的安装开始细致入微地讲解各个常用模块的部署和参数使用,需要的朋友可以参考下
    2016-04-04

最新评论