Reverse Proxy to local container

I need run Kafka on docker with web UI on some specific domain AND LINK, for example:

http://somesite.com/kafka

I am using this docker-compose.yml.

version: '3.3'
services:
  zookeeper:
    image: 'bitnami/zookeeper:latest'
    ports:
      - '2181:2181'
    environment:
      - ALLOW_ANONYMOUS_LOGIN=yes
  kafka:
    image: 'bitnami/kafka:latest'
    ports:
      - '9092:9092'
    environment:
      - KAFKA_BROKER_ID=1
      - KAFKA_CFG_LISTENERS=PLAINTEXT://:9092
      - KAFKA_CFG_ADVERTISED_LISTENERS=PLAINTEXT://127.0.0.1:9092
      - KAFKA_CFG_ZOOKEEPER_CONNECT=zookeeper:2181
      - ALLOW_PLAINTEXT_LISTENER=yes
    depends_on:
      - zookeeper
  kafka-ui:
    image: 'provectuslabs/kafka-ui:latest'
    environment:
      - KAFKA_CLUSTERS_0_NAME=local
      - KAFKA_CLUSTERS_0_BOOTSTRAPSERVERS=kafka:9092
      - KAFKA_CLUSTERS_0_ZOOKEEPER=zookeeper:2181
    depends_on:
      - kafka
    networks:
      - default
    ports:
      - '9099:8080'

When I set apache2 by direct domain kafka.somesite.com, it is working.

<VirtualHost *:80>
  ServerName kafka.somesite.com
  ProxyPreserveHost On
  ProxyPass / http://127.0.0.1:9099/
  ProxyPassReverse / http://127.0.0.1:9099/
</VirtualHost>

But when I try set domain with the link somesite.com/kafka, there is only blank screen.

<VirtualHost *:80>
  ServerName somesite.com
  ProxyPreserveHost On
  ProxyPass /kafka http://127.0.0.1:9099/
  ProxyPassReverse /kafka http://127.0.0.1:9099/
</VirtualHost>

How can I make Kafka functional with link?

Thank you.

You have to change two things. First, you need to configure the base URL of the kafka-ui container, you can do that using the SERVER_SERVLET_CONTEXT_PATH environment variable.

# ...
  kafka-ui:
    image: 'provectuslabs/kafka-ui:latest'
    environment:
      - KAFKA_CLUSTERS_0_NAME=local
      - KAFKA_CLUSTERS_0_BOOTSTRAPSERVERS=kafka:9092
      - KAFKA_CLUSTERS_0_ZOOKEEPER=zookeeper:2181
      - SERVER_SERVLET_CONTEXT_PATH=/kafka
# ...

If you don't, all URLs generated by the kafka-ui will start at /, resulting in CSS, JavaScript and such being fetched from / instead of /kafka/.

Then you need to adapt the ProxyPass directive to that path:

ProxyPass /kafka/ http://127.0.0.1:9099/kafka/
ProxyPassReverse /kafka/ http://127.0.0.1:9099/kafka/

With ProxyPass always make sure your trailing slashes match, as noted in the documentation:

If the first argument ends with a trailing /, the second argument should also end with a trailing /, and vice versa. Otherwise, the resulting requests to the backend may miss some needed slashes and do not deliver the expected results.

ServerName should still be somesite.com, because Apache still expects that as base URL. When the URL is somesite.com/kafka it should redirect it to http://127.0.0.1:9099/

Bottom line, the second configuration should work as long as you set ServerName somesite.com