Why is Chrome not allowing resources to load?

Question

I have a web server, built into a device, sitting behind a firewall. The web server is on port 80, but many times port 80 is already in use by some other device. i.e. DVR.

To access the server from the web, I use an alternative port, like 9300. Until recently this worked fine in Chrome, but as of around version 56 I get a "net::ERR_INVALID_HTTP_RESPONSE" when the page tries to load other resources, like java script or css files. I have read that Chrome is blocking standard ports < 1024, but I don't understand what that has to do with the port I'm using. The page loads, but not the resources. This acts more like across-origin problem. Everything still works, at the moment in Fire Fox.

Can anyone explain why Chrome isn't working and if there is a solution, other than just giving up on Chrome? Any help would be greatly appreciated. I have spent many hours trying to find a solution, but nothing I can find seems to fit this situation.

Answer 1

I am seeing this on Chrome 63 where there is a bad proxy. To resolve:

1. Open chrome://net-internals/#proxy
2. Click Clear bad proxies

The chrome://net-internals/#events tab can be useful to view what is going on.

Answer 2

Chrome 55 was notorious for net::ERR_INVALID_HTTP_RESPONSE, when using custom ports outside of 80, 8080 and 443. This affected thousands of servers but notably Shoutcast Version 1 and 2.

A simple fix may just be to use 8080 instead of 9300 as it can coexist with 80. But your issue here is your browser, not your server or hardware. The real fix is to update your browser to a version that is considered stable and up to date.

Google released a build that fixed this very issue after many complaints. Considering that we are now in version 59 stable and 60 stable development, you should update your Chrome to resolve this issue, after all that's why we get new versions of browsers all the time to fix issues, sometimes new fixes break things etc.

Further findings...

Your server is not serving CSS or JS correctly, and possibly other server-side resources. This is actually reported in the Firefox console.

Doing a curl on a element or page should look something like this:

https://www.bybe.net/wp-content/themes/showboat/style.css

HTTP/1.1 200 OK
Date: Tue, 01 Aug 2017 15:36:05 GMT
Content-Type: text/css
Transfer-Encoding: chunked
Connection: keep-alive
Set-Cookie: __cfduid=d01134b2133a3b0424baada976e2258ff1501601765; expires=Wed, 01-Aug-18 15:36:05 GMT; path=/; domain=.bybe.net; HttpOnly
Last-Modified: Fri, 07 Apr 2017 14:51:08 GMT
ETag: W/"28c5b-54c94c1738f00-gzip"
Vary: Accept-Encoding
CF-Cache-Status: HIT
Expires: Tue, 01 Aug 2017 19:36:05 GMT
Cache-Control: public, max-age=14400
Server: cloudflare-nginx
CF-RAY: 3879defb19795687-IAD

Doing a CURL on your resources returns this:

1. NULL
2. NULL

The code above is not valid and should not work at all. The reason that FireFox is working while Chrome is not is because Chrome is more strict when it comes to security concerns.

Doing a CURL on your pages returns:

HTTP/1.0 200 OKAY
Content-Type: text/html
Cache-Control: no-cache

To replicate this issue, you can do a online test yourself using online CURL. To add your username and password, click + Add Option, find user -u and click it, then Insert Attributes as YourUsername:YourPassword.

So, the solution to all your problems is to fix your web server serving all files and pages correctly.