以 Apache2 作为代理的 Dockerized joomla 站点，加载.js文件时出现问题

Question

我正在将最初安装在一台服务器(例如SERVER_1)下的joomla网站作为Apache 2下的Web应用程序移动到另一台服务器(SERVER_2)。

在第二台服务器中，joomla 站点作为 docker 容器安装(实际上是两个 docker 容器，第二个运行 mysql 实例)。joomla contiainer公开了端口8081，如果我通过浏览器http://<SERVER_2_IP>:8081/访问该网站可以完美运行。

现在，我尝试将提供商上的 DNS 设置更改为名称www.example.com从旧服务器的 IP 更改为新服务器的 IP。此外，在SERVER_2我有一个 apache2，我用它来充当代理，将请求转发给www.example.com到正确的端口 8081。以下是 apache2 的虚拟主机定义文件(我不是 apache2 配置的专家，只是将其从配置映射复制到其他容器化应用程序，非 joomla 应用程序，工作正常)。

<VirtualHost *:80>
ServerName www.example.com
<LocationMatch "^/">
AllowOverride None
Require all granted
</LocationMatch>
ErrorLog /path/to/folder/under/home/example.error.log
LogLevel trace1
CustomLog /path/to/folder/under/home/example.access.log combined
ProxyPass / http://localhost:8081/
ProxyPassReverse / http://localhost:8081/
</VirtualHost>

问题是，当从http://www.example.com浏览器访问该站点时，尽管找到了该站点，但似乎样式已损坏。如果我检查浏览器控制台，我会看到如下错误列表(注意：我从意大利语翻译了 thte 消息，因此实际错误消息可能有所不同)。

Loading failed for the <script> with source “http://localhost:8081/media/jui/js/jquery.min.js”.
Loading failed for the <script> with source “http://localhost:8081/media/jui/js/jquery-noconflict.js”.
Loading failed for the <script> with source “http://localhost:8081/media/jui/js/jquery-migrate.min.js”.
Loading failed for the <script> with source “http://localhost:8081/media/system/js/caption.js”.
Loading failed for the <script> with source “http://localhost:8081/media/system/js/mootools-core.js”.
Loading failed for the <script> with source “http://localhost:8081/media/system/js/core.js”.
Loading failed for the <script> with source “http://localhost:8081/media/system/js/mootools-more.js”.
Loading failed for the <script> with source “http://localhost:8081/media/jui/js/bootstrap.min.js”.
Loading failed for the <script> with source “http://localhost:8081/templates/whalesafe/javascript/md_stylechanger.js”.
Loading failed for the <script> with source “http://localhost:8081/templates/whalesafe/javascript/hide.js”.
Loading failed for the <script> with source “http://localhost:8081/templates/whalesafe/javascript/respond.src.js”.
Loading failed for the <script> with source “http://localhost:8081/media/sourcecoast/js/jq-bootstrap-1.8.3.js”.

该问题似乎与 joomla 代码尝试从localhost而不是www.example.com访问 javascript 文件有关，但我对如何解决这个问题没有进一步的想法。

正如我所写，如果我使用IP/PORT访问浏览器(我的本地机器与服务器位于同一网络下，所以我可以直接从这里访问端口 8081)，一切都很好，就像在旧服务器上访问站点时一样。

编辑：只是为了添加更多详细信息，当我加载主页时，不仅样式被破坏，而且菜单链接现在指向http://localhost:8081/index.php/en/...page url...

Answer 1

尝试更改配置文件的底部：

ProxyPass / http://localhost:8081/
ProxyPassReverse / http://localhost:8081/

自

ProxyPreserveHost On
ProxyPass / http://www.example.com:8080/
ProxyPassReverse / http://www.example.com:8080/

还要确保通过 HTTP 而不是 HTTPS 请求所有资源，因为您需要为这两个协议提供一个单独的端口。

这应该可以立即修复它;但请考虑将容器设置为转发https流量，并将您的网站移动到https。

此外，这些指令应该由mod_proxy处理，也许您的代理并没有像您期望的那样真正工作(它正在执行重定向而不是代理)，因此用户会看到 8081 端口，我认为这可能是不可取的，因此请确保不会发生这种情况。

Answer 2

如下所述，将所有 trafic 从http转发到https： 容器为阿帕奇提供http，然后提供https这将防止端口对用户可见，并为容器提供隔离，只要容器由与前向 Web 服务器不同的 UID 拥有。ProxyPreserveHost指令执行它应该做的事情，并在不暴露端口等的情况下呈现内容。

<VirtualHost 192.168.2.4:80>
ServerName joomtest.mooo.com
ProxyPreserveHost On
ProxyPass / http://192.168**.3:8080/
ProxyPassReverse / http://192.168.**.3:8080/
Redirect permanent / https://joomtest.mooo.com/
</VirtualHost>
<VirtualHost 192.168.2.4:443>
ServerName joomtest.mooo.com
ProxyPreserveHost On
ProxyPass / http://192.168.2.3:8080/
ProxyPassReverse / http://192.168.2.3:8080/
ServerName joomtest.mooo.com
ServerAdmin [e-mail]
ErrorLog /var/log/apache2/joomtest.mooo.com.error.log
CustomLog /var/log/apache2/joomtest.mooo.com.access.log combined
SSLEngine On
SSLCertificateFile /etc/letsencrypt/live/joomtest.mooo.com/fullchain.pem
SSLCertificateKeyFile /etc/letsencrypt/live/joomtest.mooo.com/privkey.pem  >
</VirtualHost>