我已经努力了好几天,想要将带有 SSL 的子域名路由到本地运行的 Vue 应用程序,特别是直接管理用户界面。
我以前曾经这样做过,例如使用工具 monit,并且效果非常好:
<VirtualHost *:80>
ServerName monit.mydomain.com
Redirect permanent / https://monit.mydomain.com
</VirtualHost>
<VirtualHost *:443>
ServerName monit.mydomain.com
ProxyPass / http://localhost:2828/
Include /etc/apache2/include.conf <-- holds the key & certificate infos
</VirtualHost>
但是对于在 localhost:3000 上运行的 directus admin ui,这不起作用,并且 apache 根本没有给我任何错误输出,但显示了一些访问日志,例如:
<IP> - - [14/Apr/2021:00:10:36 +0200] "GET /admin/js/chunk-vendors.8f8dd28c.js HTTP/1.1" 404 418 "https://admin.mydomain.com/app1/" "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.114 Safari/537.36 Edg/89.0.774.75"
浏览器仅显示:
GET https://admin.mydomain.com/admin/js/app.0038e4e5.js net::ERR_ABORTED 404 (Not Found)
我使用的 VirtualHost 配置是:
<VirtualHost *:80>
ServerName admin.mydomain.com
Redirect Permanent / https://admin.mydomain.com
</VirtualHost>
<VirtualHost *:443>
ServerName admin.mydomain.com
Include /etc/apache2/include.conf
RewriteEngine on
RewriteRule ^/app1/(.*)$ http://localhost:3000/admin/$1 [proxy,last]
ProxyPassReverse /app1http://127.0.0.1:3000/
</VirtualHost>
原因是/app1
我稍后想为多个应用程序路由管理用户界面,每个应用程序都在不同的端口上运行,例如/app1 -> http://localhost:3000, /app2 -> http://localhost:3100
希望有人能给我一些提示来解决这个问题,提前谢谢了!
答案1
为什么要将 RewriteRule 与 ProxyPassReverse 混合使用?以下方法可以解决
ProxyPass /app1/ http://localhost:3000/admin/
ProxyPassReverse /app1/ http://localhost:3000/admin/
您可以使用以下命令在反向代理上进行测试
curl --insecure -H 'Host: admin.mydomain.com' -is https://127.0.0.1/app1/
根据我的经验,使用 curl 测试配置对于故障排除更有用,特别是涉及重定向时。