Apache 2.4 Subdomain Proxy Balancer and Reverse Proxy

I have a Next.js application running on two ports 3000 and 3001, and I want to use apache 2.4 reverse proxy to achieve this:

https://app.com/*      ->  localhost:300x/*
https://user.app.com/* ->  localhost:300x/user/*

So far my setting is like below:

<VirtualHost app.com:80>
  ServerName app.com
  <Proxy "balancer://mycluster">
    BalancerMember "http://localhost:3000" route=1 retry=10
    BalancerMember "http://localhost:3001" route=2 retry=10
  </Proxy>
  ProxyPass        "/" "balancer://mycluster/"
  ProxyPassReverse "/" "balancer://mycluster/"
</VirtualHost>

<VirtualHost user.app.com:80>
    ServerName user.app.com
    <Proxy "balancer://mycluster">
      BalancerMember "http://localhost:3000" route=1 retry=10
      BalancerMember "http://localhost:3001" route=2 retry=10
    </Proxy>
    ProxyPass        "/" "balancer://mycluster/user/"
    ProxyPassReverse "/" "balancer://mycluster/user/"
</VirtualHost>

But whenever I access https://user.app.com it redirects me to https://user.app.com/user with 4o4 error

Hopefully someone can point out what I did wrong. Thank you in advance.

You did not specify a configuration for your https request. You need to create an according configuration for <VirtualHost app.com:443> and <VirtualHost user.app.com:443>. I assume you have another reverse proxy before this one, otherwise I don't understand why you even get a response on that GET.

There is no redirect in your configuration, are you sure you get redirected? If you get redirected you might want to look into and share your application code as well. The redirect might happen in your web application itself.