讓Lychee網路相簿的歡迎頁顯示Unsplash的隨機圖片&定時自動更新

Lychee本身有內建歡迎頁面的功能,就是在進入網站時會顯示預先設定好的歡迎訊息,以及所要使用的背景圖片。我在切換到Lychee之初有設定讓它直接去Unsplash的隨機圖庫抓一張圖片當作背景,但是後來Lychee更新之後,它它就無法從Unsplash的隨機圖庫抓圖片,只能設定靜態圖片。今天我想到了一個辦法,讓Lychee能夠正常顯示來自Unsplash隨機圖酷的圖片,並且能夠自動更新,同時也有了這篇文章。

進行之前,有幾點需要留意:

  1. 以下於Lychee上的操作都是使用繁體中文介面的Lychee進型
  2. 此方法需要所使用的主機能夠支援
    1. cron排程執行指令(本例使用systemd的timer)
    2. SSH登入,因為以下包含需要在主機上執行指令操作的部分
  3. 無法做到每次重整頁面後即時更新背景圖片(我最初設定時是這個效果),如要如此就需要修改Lychee下的public目錄的index.php
    我不這麼做是因為一方面是我對PHP不熟悉,另一方面是每次更新之後又必須改一次

那我們就進入正題吧。

  1. 登入自建的Lychee網站,點選左上方的齒輪圖示,然後選擇[設定]
  2. 把畫面往下拉到底,找到[更多]
  3. 找到Mod Welcome區域中的landing_background(下圖紅箭頭),將其修改為”你的Lychee相簿網站網址/圖片名稱”(請依實際使用的名稱填寫,別照抄這裡的!
    別忘了上面langing_page_enable要設成1,不然是看不到的喔

    最後點選最底下的”Save my modifications, I accept the Risk!”(儲存我的修改,我願意承擔風險)鈕,儲存變更

好,到這裡Lychee網站部分已經完成設定,接著進行網頁伺服器與指令的設置。

網頁伺服器:設定不針對背景圖片進行快取;不設定也是可以顯示,只是後續圖片有更新時,瀏覽器仍會顯示舊的那張,那就沒有意義了
指令:讓系統自行到Unsplash抓取隨機圖片,並儲存成指定的檔名,之後讓Lychee網站去讀這個檔案;之後我們會設定排程,讓系統定時自動執行它
檔案位置:存放在Lychee的public目錄下,這樣Lychee才能從前面設定的網址找到圖片並顯示出來

設定網頁伺服器,不針對背景圖片做快取(以Nginx伺服器為例)

  1. 使用SSH登入主機,進入nginx的設定檔目錄。以Ubuntu為例,其位置為:/etc/nginx/sites-available(如已經設定啟用,也可以去sites-enabled找)
    找到Lychee的設定檔,接著以vi/vim/nano開啟編輯(系統有支援哪個就用哪個,一般都是可以用的,我個人是用nano)
  2. 如果有多個server區段?
    1. 設定檔是專供Lychee網站使用,且有設定http跳轉https:找有包含https設定的那個區段
    2. 包含多個網站:找跟Lychee有關的那一段(如有設定https則一樣找有包含https設定的)
  3. 在選定的server區段中加入以下內容:
    location ~* \.(jpg|jpeg|png|gif|webp)$ {
    add_header 'Cache-Control' 'no-store, no-cache, must-revalidate>
    expires -1;
    }
    以上就是設定伺服器不針對圖片做快取,從而避免發生圖片已更新,但頁面重整後卻未更新的bug。
  4. 存檔退出,最後執行nginx -s reload重新載入設定即可(在此之前可以執行nginx -t檢查)

抓取/更新圖片排程(使用systemd的timer,需要分別存成.timer與.service檔案,並移動到/etc/systemd/system)
本例的檔案名稱分別為update-lychee-splash.timer與update-lychee-splash.service

[Unit]
Description=Update Image from Unsplash
DefaultDependencies=no
After=timers.target

[Timer]
OnActiveSec=5m
OnUnitActiveSec=5m

[Service]
Type=oneshot
User=www-data
ExecStart=/usr/bin/wget -q -O /var/www/Lychee/public/home_img.jpg https://source.unsplash.com/random/1920x1080

[Install]
WantedBy=timers.target

文字顏色說明

  • 黑字:timer與service共用參數
  • 紅字:timer專用參數
  • 綠字:service專用參數

最後執行sudo systemctl enable --now update-lychee-splash.timer就會每5分鐘自動更新了

如對這方面有興趣想進一步了解,歡迎到鳥哥私房菜去看看。

如果設定的是cron,要設定的指令為(cron參數說明一樣請移駕鳥哥私房菜):

*/5 * * * * /usr/bin/wget -q -O /var/www/Lychee/public/home_img.jpg https://source.unsplash.com/random/1920x1080

最後是抓取圖片的指令解說

wget -q -O /var/www/Lychee/public/home_img.jpg https://source.unsplash.com/random/1920x1080

參數說明

  • -q:不輸出任何訊息
  • -O /var/www/Lychee/public/home_img.jpg:將圖片儲存為指定的名稱,並存放在指定位置下;本例為Lychee的程式路徑,圖片檔名為home_img.jpg
    這裡可以依照實際情況來做相應修改,但別忘了檔名必須與前面設定的網址一致,否則圖片會無法顯示!
  • https://source.unsplash.com/random/1920×1080:抓取圖片的網址。
    本例指定解析度為1920*1080,如要使用不同解析度,可以自行修改,也可以不指定解析度
    更多用法請參考這篇的說明(英文)

這樣就可以讓你自架的Lychee相簿網站的歡迎頁背景自動更新了,但是是定時更新,而非每次進去就更新那種。缺點還是有的,一是設定真的對新手不友好,二是無法即時更新。

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料