Err_http2_protocol_error

#1

Hello,

After searching a lot, I could not find any topic with the error I’m currently having, which is “ERR_HTTP2_PROTOCOL_ERROR”. I’ve seen ERR_SSL and ERR_SPDY being discussed but not this one.

I use Cloudflare as a CNAME proxy of my .com domain to my Heroku App. It’s currently set to Proxied (instead of DNS Only). Problem is, for some pages, looking at Network tab, the document and the assets are downloaded but the page almost never renders, instead, after a while, Chrome dies with “Failed to load resource: net::ERR_HTTP2_PROTOCOL_ERROR”.

Example URL: https://epicsevendb.com/hero/blood-blade-karin
Problem is, running locally or accessing the Heroku provided URL, this issue NEVER happens: https://epicsevendb-ui.herokuapp.com/hero/blood-blade-karin

Once in a while, trying the example URL might load the html partially instead of giving this error. Nevertheless, since the only difference is that one passes through CF and the other goes directly, I’m unsure what I can do to fix on CF side.

Steps to reproduce:

  • Open Chrome Incognito Tab
  • Open Devtools, leave on Network Tab
  • Paste above URL and press Enter

You’ll see one Document and 5 .js assets. Even though document has status 200, page will not load and after some timeout, Console will show the error and the Document status will change to (failed).

Chrome: Failed to load resource: net::ERR_HTTP2_PROTOCOL_ERROR:

image
image.png1840×896 152 KB

Safari: Failed to load resource: The operation couldn’t be completed. (kCFErrorDomainCFNetwork error 303.)
(image removed as new user can only post one, doh)

I’ve been extensively testing this and it never happens on any browser on heroku’s direct URL, only when using my domain passing through CF.

I thought in disabling HTTP/2 but KB Topic points that this is not an option for free CF usage, only Pro and higher plans. I tried disabling TSL 1.3 just to see if would make any difference, but none happened.

Thank you for any insight!

Best,
RaphaelDDL

1 Like
#2

I believe I have discovered the issue.

The issues is with CloudFlare itself and BASE64 images.

Like I mentioned before, once in a while, instead of getting the HTTP2 issue, the page would partially load, and when I say partially load, it would show the HTML only until the base64 string of the image, and nothing after it.

After further testing on Incognito tabs on multiple browsers, then doing the changes on the code from a BASE64 to a real .png image, the issue never happened again, in ANY browser. The .png had around 500kb before becoming a base64,so CloudFlare has issues with huge lines of text on same line (since base64 is a long string) as a proxy between the domain and the heroku. As mentioned before, directly hitting Heroku url also never happened the issue.

Is there a way to report this kind of issues to CloudFlare? All support links normally end on “Ask the Community” :confused:

#3

I have the same issue with my Nextcloud Docker.

Works fine in Firefox/IE, but in Chrome or Android I get the “ERR_HTTP2_PROTOCOL_ERROR”

Still haven’t found a fix for it. A Chrome Net Export reveals the following in the log:

    t=2234 [st= 1] -HTTP_STREAM_REQUEST

    t=2234 [st= 1] +HTTP_TRANSACTION_SEND_REQUEST [dt=1]

    t=2234 [st= 1] HTTP_TRANSACTION_HTTP2_SEND_REQUEST_HEADERS

    ______________--> :method: GET

    ______________:authority: drive.mydomain.com

    ______________:scheme: https

    ______________:path: /

    ______________cache-control: max-age=0

    ______________upgrade-insecure-requests: 1

    ______________user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML,   like Gecko) Chrome/77.0.3865.75 Safari/537.36

______________sec-fetch-mode: navigate

______________sec-fetch-user: ?1

______________accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3

______________sec-fetch-site: none

______________accept-encoding: gzip, deflate, br

______________accept-language: en-US,en;q=0.9

t=2235 [st= 2] -HTTP_TRANSACTION_SEND_REQUEST

t=2235 [st= 2] HTTP_TRANSACTION_READ_HEADERS [dt=157] --> net_error = -337 (ERR_HTTP2_PROTOCOL_ERROR)

t=2392 [st=159] -URL_REQUEST_START_JOB --> net_error = -337 (ERR_HTTP2_PROTOCOL_ERROR)

t=2392 [st=159] URL_REQUEST_DELEGATE_RESPONSE_STARTED [dt=0]

t=2392 [st=159] -REQUEST_ALIVE --> net_error = -337 (ERR_HTTP2_PROTOCOL_ERROR)
#4

Funny, net_error -337 is also tied to the ERR_SPDY_PROTOCOL_ERROR one. Which a search always end on having to delete cache, disabling workers, etc. But it’s not much related to HTTP2 one, at least not on my case.

Yours are rendering fine on FF ? When happened for me, no browser would render, each one with a different error. Can you right click your page, see source-code and see if there’s any giant string that makes the horizontal scroll big? In my case, that was the issue, cloudflare seemed to not handle it well when proxying the request from heroku through it

#5

The same issue

2
2.PNG1032×433 34 KB

1 Like
#6

Yours are rendering fine on FF ? When happened for me, no browser would render, each one with a different error. Can you right click your page, see source-code and see if there’s any giant string that makes the horizontal scroll big? In my case, that was the issue, cloudflare seemed to not handle it well when proxying the request from heroku through it

Yeah Firefox and Edge load the page just fine. In FF if I load my site and check source code I do see one line that is very long horizontally:

var oc_capabilities={"core":{"pollinterval":60,"webdav-root":"remote.php\/webdav"},"bruteforce":{"delay":0},"activity":{"apiv2":["filters","filters-api","previews","rich-strings"]},"ocm":{"enabled":true,"apiVersion":"1.0-proposal1","endPoint":"https:\/\/drive.mydomain.com\/ocm","resourceTypes":[{"name":"file","shareTypes":["user","group"],"protocols":{"webdav":"\/public.php\/webdav\/"}}]},"richdocuments":{"mimetypes":["application\/vnd.oasis.opendocument.text","application\/vnd.oasis.opendocument.spreadsheet","application\/vnd.oasis.opendocument.presentation","application\/vnd.openxmlformats-officedocument.wordprocessingml.document","application\/vnd.openxmlformats-officedocument.spreadsheetml.sheet","application\/vnd.openxmlformats-officedocument.presentationml.presentation"],"collabora":[],"direct_editing":false,"templates":false},"dav":{"chunking":"1.0"},"files_sharing":{"api_enabled":true,"public":{"enabled":true,"password":{"enforced":false},"expire_date":{"enabled":false},"multiple_links":true,"send_mail":false,"upload":true,"upload_files_drop":true},"resharing":true,"user":{"send_mail":false,"expire_date":{"enabled":true}},"group_sharing":true,"group":{"enabled":true,"expire_date":{"enabled":true}},"default_permissions":31,"federation":{"outgoing":true,"incoming":true,"expire_date":{"enabled":true}},"sharebymail":{"enabled":true,"upload_files_drop":{"enabled":true},"password":{"enabled":true},"expire_date":{"enabled":true}}},"notifications":{"ocs-endpoints":["list","get","delete","delete-all","icons","rich-strings"],"push":["devices","object-data"],"admin-notifications":["ocs","cli"]},"password_policy":{"minLength":8,"enforceNonCommonPassword":true,"enforceNumericCharacters":false,"enforceSpecialCharacters":false,"enforceUpperLowerCase":false},"theming":{"name":"Nextcloud","url":"https:\/\/nextcloud.com","slogan":"a safe home for all your data","color":"#00659A","color-text":"#ffffff","color-element":"#00659A","logo":"https:\/\/drive.mydomain.com\/core\/img\/logo\/logo.svg?v=2","background":"https:\/\/drive.mydomain.com\/core\/img\/background.png?v=2","background-plain":false,"background-default":true},"files":{"undelete":true,"bigfilechunking":true,"blacklisted_files":[".htaccess"],"versioning":true}};