無法通過 HTTPS 訪問 WordPress docker 容器的靜態文件

Question

我正在嘗試通過 HTTPS 創建一個 WordPress 容器，我在 VPS 上運行 Apache 並將其用作代理將請求路由到 WordPress 容器。

我已經設法訪問容器以通過 HTTPS 加載 WordPress 安裝頁面，但是 CSS/JS 文件無法加載，因為它們是通過 HTTP 請求的我不知道為什么重定向不適用於這些文件，我做了其他網站，如這個。

這是輸出的打印

如果我訪問“ http://example.com/wp-admin/css/install.min.css?ver=5.2.2 ”上的文件，重定向工作正常（訪問上面的鏈接后通過 HTTPS 打印 css 文件)

這是域上 80 到 443 的重定向。

<VirtualHost *:80>
    ServerName example.com
    ServerAdmin admin@example.com
    Redirect permanent / https://example.com/
</VirtualHost>

這是 443 上的代理：

<IfModule mod_ssl.c>
    <VirtualHost *:443>
        ServerName example.com
        ProxyPreserveHost On

        ProxyPass / http://172.20.0.100/ 
        ProxyPassReverse / http://172.20.0.100/


        SSLEngine on

        SSLCertificateFile /fullchain.pem
        SSLCertificateKeyFile /privkey.pem
    </VirtualHost>
</IfModule>

WordPress 容器僅偵聽端口 80

這是 docker-compose 文件：

version: '3'

services:
  wpdb:
    image: mysql:5.7
    volumes:
      - db_data:/var/lib/mysql
    restart: always
    environment:
        MYSQL_ROOT_PASSWORD: pass
        MYSQL_DATABASE: wordpress
        MYSQL_USER: wordpres_admin
        MYSQL_PASSWORD: pass

  wordpress:
    depends_on:
     - wpdb
    image: wordpress:latest

    networks:
      default:
        ipv4_address: 172.20.0.100
    restart: always
    environment:
        WORDPRESS_DB_HOST: wpdb:3306
        WORDPRESS_DB_USER: wordpres_admin
        WORDPRESS_DB_PASSWORD: pass
volumes:
    db_data: {}

networks:
 default:
   external:
     name: router_default

我怎么解決這個問題？

Answer 1

我找到了解決方案，看起來 WP 已經配置為通過帶有 SSL 的代理使用，並且無需更改 WP 容器或 WP 設置中的任何內容，所有需要做的就是重寫請求的標頭：

RequestHeader set X-Forwarded-Proto "https"

更新后的代理配置如下所示：

<IfModule mod_ssl.c>
<VirtualHost *:443>
    ServerName example.com

    <IfModule headers_module>
        RequestHeader set X-Forwarded-Proto "https"
    </IfModule>

    ProxyPreserveHost On

    ProxyPass / http://172.20.0.100/ 
    ProxyPassReverse / http://172.20.0.100/


    SSLEngine on

    SSLCertificateFile /fullchain.pem
    SSLCertificateKeyFile /privkey.pem
</VirtualHost>

欲了解更多信息： https : //wordpress.org/support/article/administration-over-ssl/#using-a-reverse-proxy和https://webmasters.stackexchange.com/questions/97005/setting-x-forwarded -proto-under-apache-2-4