You are not logged in.

#1 2019-02-21 20:12:47

MK13
Member
From: Germany
Registered: 2014-04-12
Posts: 80

Apache proxy leads to broken CSS files

Hi,

first of all: the distribution used here is Fedora 28 as it's about my VPS where arch is not available unfortunately sad I hope it's OK to post this here though.

My VPS runs an Apache httpd 2.4.34 instance. It also runs a Jenkins CI instance on a Tomcat 8.5.32 since recently. I do not want to expose the Tomcat directly to the world, so I proxied it via httpd:

ProxyRequests     Off
ProxyPreserveHost On
ProxyPass         /jenkins  http://localhost:8080/jenkins/ nocanon
ProxyPassReverse  /jenkins  http://localhost:8080/jenkins/
RequestHeader set X-Forwarded-Proto "https"
RequestHeader set X-Forwarded-Port "443"

and restricted access to Tomcat to only 127.0.0.1. This works except for one thing: CSS files cannot be loaded, meaning the side renders but looks not like it should.

If I try to access a CSS resource directly via the httpd proxy, e.g.

https://host.tld/jenkins/static/3cfe3946/css/layout-common.css

both Chromium and Firefox fail to get the file. Chromium shows the following exception:

net::ERR_CONTENT_DECODING_FAILED 200

It also displays the following warning:

Resource interpreted as Document but transferred with MIME type text/css

So I suspected that the proxy somehow messes with the Content-Type response header and went on to compare the headers of the responses of the httpd proxy and the direct communication with the Tomcat. The warning with the "... as Document..." is printed for the direct communication with the Tomcat as well, but the CSS file is displayed nonetheless.

Here are the response headers, proxy is on the left, direct Tomcat on the right:
lxsKjwA.png

The differences:
1) The httpd proxy adds ";charset=utf-8" to the Content-Type header field
2) The Content-Length differs

Even though I didn't think that the added charset causes the issue I edited the Content-Type header field:

Header edit Content-Type "text/css;charset=utf-8" "text/css"

While this led to the proper Content-Type it did not fix the issue. I then went on to request the file via wget and curl which worked as expected.

The logs look OK on httpd and Tomcat.

I'm not sure where to look and what to try anymore, so please help me out smile If you need more info I will gladly add them.

Many thanks

Last edited by MK13 (2019-02-21 20:23:34)

Offline

#2 2019-03-12 13:00:12

Twiki
Banned
Registered: 2018-03-30
Posts: 40

Re: Apache proxy leads to broken CSS files

MK13 wrote:

Hi,

If I try to access a CSS resource directly via the httpd proxy, e.g.

https://host.tld/jenkins/static/3cfe3946/css/layout-common.css

both Chromium and Firefox fail to get the file. Chromium shows the following exception:

net::ERR_CONTENT_DECODING_FAILED 200

Try with "compression" set to "false" in Tomcat's server.xml.

MK13 wrote:

Hi,
It also displays the following warning:

Resource interpreted as Document but transferred with MIME type text/css

Check if the request header (of Chromium) contains text/css. Line starting with for example Accept:application/xml,application/xhtml+xml,text/html;..... If not, add the mime type for CSS.

Last edited by Twiki (2019-03-12 13:00:52)


Bidi-bidi-bidi-bidi.

Offline

Board footer

Powered by FluxBB