Recently I stumbled upon an issue with a web application that was proxied by HAProxy.

The issue was that the requests that started from the HTML document were served and requested over HTTPS, but "inner" resources (AJAX calls, images, etc.) were configured as HTTP.

without-x-forwarded-proto

This was causing a Mixed Content error in the Chrome developer console:

mixed-content

To solve this, you can instruct the proxy to upgrade requests sent between the client and the load balancer to a specific protocol namely HTTPS:

backend app1
  http-request set-header X-Forwarded-Proto https if { !ssl_fc }
  server app1 127.0.0.1:1234

with-x-forwarded-proto


For more info, refer to the following resources: