nginx开启http2导致的服务验证码不可用问题

原创已于 2023-07-03 18:19:01 修改 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#nginx #redis #运维

于 2023-07-03 17:16:09 首次发布

文章讲述了在使用Nginx进行https反向代理时，开启http2协议导致验证码无法显示的问题。原因是HTTP2服务器返回的响应头名称强制为小写，与JavaScript的xhr.getAllResponseHeaders()方法预期不符，从而引发错误。解决方案是理解和适配HTTP2协议的这一特性或调整服务器配置。

问题描述:

新搭建了一套开源的系统。通过nginx做了https反向代理后无法显示验证码。
请添加图片描述
具体报错： Uncaught TypeError: Cannot read properties of null (reading ‘property’)
点击报错后跳转到方法： xhr.getAllResponseHeaders()
问题就出在这个方法，但不知识具体原因。

通过做实验方法排除。

新搭建一个nginx只配置一个域名。发现同样的配置又能正常访问。
通过正常请求和异常请求的nginx日志分析，发现异常请求时使用的HTTP/2.0协议。
多次验证后在新环境配置上加了http2协议支持后问题复现。
最后得到结论是nginx开启了http2协议问题导致。

反找问题根源

1、因服务器有多个站点，一个站点开通了http2所有站点默认都开启http2。所以相同的配置在只有一个站点的服务器上访问没有问题。多站点上就出现了问题。
参考：Nginx 设置http1.1和http2

2、再用关键字搜索: http2 xhr.getAllResponseHeaders()
找到： XHR.getAllResponseHeaders() does not return headers as expected in Chrome 60
又通过上面的回复找到： Web compat implications of making getAllResponseHeaders lowercase

最终得到结论：

When reading the specification I can’t see any place saying that getAllResponseHeaders() must returns header names in lower case, furthermore since HTTP2 servers must return header in lower case getAllResponseHeaders() will return header in lower case for this specific protocol.

在阅读规范时，我看不到任何地方说getAllResponseHeaders（）必须以小写形式返回标头名称，此外，由于HTTP2服务器必须以小写形式返回标头getAllResponseHeaders（）将返回此特定协议的小写标头。