Live reload or SFTP upload of JS/CSS triggers ERR_HTTP2_PROTOCOL_ERROR

After editing a JavaScript or CSS file on the server (via SFTP), refreshing the browser sometimes causes that asset to fail with net::ERR_HTTP2_PROTOCOL_ERROR, even though opening the same file directly works.

This can occur due to file write races or cache mismatches leading to partial or inconsistent file states served over HTTP/2 ([turn0search1](Stack Overflow. Root cause: • The asset is being overwritten on disk while NGINX/Apache is serving it, causing corrupted bytes or truncated transmission mid-response. • The mismatch between requested file size and the response body triggers HTTP/2 framing errors again. Fixes: • Disable on-the-fly caching or minification plugins temporarily during development. • Force cache bypass until file sync completes (e.g. reload after few seconds). • Ensure atomic file replacement mechanisms, or serve via local dev environment instead of live server.

🧷 Tags javascript, css, http2, live-reload, ERR_HTTP2_PROTOCOL_ERROR, sftp, nginx, static-assets, file-sync

📌 TL;DR net::ERR_HTTP2_PROTOCOL_ERROR often stems from HTTP/2 protocol violations—such as truncated transmissions, compression mismatches, oversized headers, or corrupted assets. Diagnose by clearing browser cache, checking server disk/headers/config, disabling gzip on both back end and proxy, and ensuring compliant HTTP/2 behavior at every layer. Let me know if you want a ready-to-post formatted Q&A with code or config snippets!