laravel - HTTP/2 服务器推送的资产加载失败 (HTTP2_CLIENT_REFUSED_STREAM)
问题描述
ERR_HTTP2_CLIENT_REFUSED_STREAM
对于通过 http2 推送的全部或部分资产,我在 chrome devtools 控制台中出现以下错误。
刷新页面并随机清除缓存可部分修复此问题,有时完全修复。
我正在使用启用了 http2 的 nginx(通过 certbot 的 ssl)和 cloudflare。
server {
server_name $HOST;
root /var/www/$HOST/current/public;
add_header X-Frame-Options "SAMEORIGIN";
add_header X-XSS-Protection "1; mode=block";
add_header X-Content-Type-Options "nosniff";
index index.html index.htm index.php;
charset utf-8;
set $auth "dev-Server.";
if ($request_uri ~ ^/opcache-api/.*$){
set $auth off;
}
auth_basic $auth;
auth_basic_user_file /etc/nginx/.htpasswd;
location / {
try_files $uri $uri/ /index.php?$query_string;
}
location = /favicon.ico { access_log off; log_not_found off; }
location = /robots.txt { access_log off; log_not_found off; }
error_page 404 /index.php;
location ~ \.php$ {
fastcgi_pass unix:/var/run/php/php7.2-fpm.sock;
fastcgi_index index.php;
fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
include fastcgi_params;
}
location ~ /\.(?!well-known).* {
deny all;
}
location ~* \.(?:css|js)$ {
access_log off;
log_not_found off;
# Let laravel query strings burst the cache
expires 1M;
add_header Cache-Control "public";
# Or force cache revalidation.
# add_header Cache-Control "public, no-cache, must-revalidate";
}
location ~* \.(?:jpg|jpeg|gif|png|ico|xml|svg|webp)$ {
access_log off;
log_not_found off;
expires 6M;
add_header Cache-Control "public";
}
location ~* \.(?:woff|ttf|otf|woff2|eot)$ {
access_log off;
log_not_found off;
expires max;
add_header Cache-Control "public";
types {font/opentype otf;}
types {application/vnd.ms-fontobject eot;}
types {font/truetype ttf;}
types {application/font-woff woff;}
types {font/x-woff woff2;}
}
listen 443 ssl http2;
ssl_certificate /etc/letsencrypt/live/$HOST/fullchain.pem; # managed by Certbot
ssl_certificate_key /etc/letsencrypt/live/$HOST/privkey.pem; # managed by Certbot
# include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
ssl_ciphers EECDH+CHACHA20:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5;
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
}
server {
if ($host = $HOST) {
return 301 https://$host$request_uri;
} # managed by Certbot
server_name $HOST;
listen 80;
return 404; # managed by Certbot
}
谷歌搜索这个错误不会返回太多结果,如果它有帮助,它是一个 laravel 6 应用程序,它会推送这些资产,如果我在 laravel 中禁用资产推送,那么所有资产都会正确加载。
我什至不知道从哪里开始寻找。
更新 1
我启用了 chrome 日志记录,并按照此处提供的说明使用 Sawbuck 检查了日志,发现实际错误与 414 HTTP 响应有某种关系,这意味着存在一些缓存问题。
更新 2
我发现这个很棒如果浏览器已经有推送的项目,它可以中止它们,其中说明如下:
如果 Chrome 已经在推送缓存中包含该项目,它将拒绝推送。
PROTOCOL_ERROR
它用而不是CANCEL
or拒绝REFUSED_STREAM
。
这导致我完全禁用 cloudflare 并直接使用服务器进行测试,我尝试了各种Cache-Control
指令并尝试禁用标头,但是在缓存清除后刷新时发生了同样的错误。
显然,即使在推送缓存中不存在,chrome 也会取消 http/2 推送资产,从而使页面损坏。
现在,我在 laravel 应用程序中禁用 http/2 服务器推送作为临时修复。
解决方案
我们刚刚遇到了您所描述的完全相同的问题。我们在其中一个 Javascript 文件中获得了“net::ERR_HTTP2_CLIENT_REFUSED_STREAM”。重新加载和清除缓存有效,但问题又回来了,似乎是随机的。Chrome 和 Edge(基于 Chromium)中的相同问题。然后我在 Firefox 中尝试并得到了相同的行为,但 Firefox 抱怨该 url 的响应是“text/html”。我的猜测是,出于某种原因,我们在 Cloudflare 中为该 url 缓存了一个“text/html”响应。当我直接在 Firefox 中打开该 url 时,我得到了“application/javascript”,然后问题就消失了。仍然不太确定这一切是如何发生的。
编辑:在我们的案例中,事实证明 .js 文件的响应被 401 的服务器阻止,我们没有发送任何缓存标头。Cloudflare 试图提供帮助,因为浏览器需要一个 .js 文件,因此即使状态为 401,响应也会被缓存。后来其他人失败了,因为我们尝试 http2 将状态为 401 的 text/html 响应推送为 .js 文件. Luckliy Firefox 为我们提供了更好的、可操作的错误消息。
EDIT2:原来这不是 http 标头缓存问题。那是我们对 .js 文件进行了 cookie 身份验证,而且似乎 http2 推送请求并不总是包含 cookie。修复是允许对 .js 文件的无 cookie 请求。
推荐阅读
- java - 如何在 Java 中为 Okttp 编写 Junit Mockito 测试
- dacpac - 使用 AAD MFA 身份验证使用 SqlPackage.exe (DACPAC) 发布的命令是什么?
- vue.js - 点击事件后函数触发,但不更新 VueJS 中的数据变量
- python-3.x - 在 Python 中解析字符串
- sql - 获取最新记录,字段可以为空
- javascript - Redux 更新嵌套对象
- python - XmlHttpRequest 请求元素为无
- haskell - Haskell 数据声明:查找二叉树中叶子的总和
- javascript - JS 错误:未捕获的 TypeError:无法读取未定义的属性“类型”
- javascript - 循环播放时音频无法通过 JavaScript 播放