首頁 計算機 Docker容器

使用 2 小時後更新

已經關閉適配了，雖然適配了之後主界面確實好用了一點點，但有太多地方沒適配，尤其是設置頁面，甚至變得幾乎不可用，因此這裡不推薦使用

眾所周知 PLEX 官方並沒有針對行動端 WEB 做適配，導致行動端的 WEB 頁面十分難用，而恰好 GitHub 上有個 專案 ，使用 nginx 反向代理來對頁面進行適配，至於最終效果，總結就是有效果但是不好用

# 直接使用

此處 PLEX 原本已經使用 Nginx Proxy Manager 進行了反向代理，這裡就直接跳過設置反向代理的步驟，直接使用。

  1. 進入 Nginx Proxy Manager 主界面，點選 Proxy Hosts 進入反向代理設置頁面
    01

  2. 選擇已經設置好的 PLEX 反向代理，點擊後面的 3 個點，再點擊 Edit 進行編輯
    02

  3. 來到編輯頁面，選擇最後一項 Advanced ，在框中粘貼 GitHub 上的 Improved Plex Mobile 專案給出的配置，然後 save 保存

proxy_set_header Accept-Encoding "";
sub_filter '</head>' '<meta name="viewport" content="width=device-width, initial-scale=1"></meta> <link rel="stylesheet" type="text/css" href="https://archmonger.github.io/Improved-Plex-Mobile/plex_mobile.css"> </head>';
sub_filter_once on;

03

開袋即食，就這麼簡單

# 進階使用方法

由於 CSS 文件是直接通過網路從 GitHub 上獲取的，如果網路中斷就有可能失效，這時候把 CSS 文件存放到本地主機是個更好的選擇

  1. 將 GitHub 專案上的 plex_mobile.css 檔案下載下來

  2. 找到 Nginx Proxy Manager 容器的卷（一般位於主機的 /var/lib/docker/volumes 路徑下），在該卷的 _data 目錄下創建一個名為 plex_mobile_css 的文件夾，並將下載的 plex_mobile.css 檔案放進去
    創建的 [容器卷]/_data/plex_mobile_css 文件夾在容器中對應的位置為 /data/plex_mobile_css

  3. 同樣在 Nginx Proxy Manager 剛剛的 Advanced 頁面裡，將配置填入
    只是將配置中的 https://archmonger.github.io/Improved-Plex-Mobile/plex_mobile.css 換為容器內的本地地址 /data/plex_mobile_css/plex_mobile.css

proxy_set_header Accept-Encoding "";
sub_filter '</head>' '<meta name="viewport" content="width=device-width, initial-scale=1"></meta> <link rel="stylesheet" type="text/css" href="/data/plex_mobile_css/plex_mobile.css"> </head>';
sub_filter_once on;