Google Cloud Shell 與 XAMPP 的完美結合

想要在 Google Cloud Shell 環境中安裝 XAMPP 很容易,但最大的問題是 VM 會洗掉,所以安裝好的 XAMPP 上完課回家後就不見了,這篇文章教會大家如何讓安裝好的 XAMPP 在回家後依然存在。

首先至 XAMPP 官網下載 Linux 版本(https://www.apachefriends.org/zh_tw/download.html),然後上傳到 Google Cloud Shell 中,或者直接在 cloud 中透過 wget 指令抓回來也可以,然後連下下面兩個指令執行抓回來的檔案,這樣就完成 XAMPP 的安裝。

$ chmod +x xampp-linux-x64-8.1.6-0-installer.run
$ sudo ./xampp-linux-x64-8.1.6-0-installer.run

安裝完成後的 XAMPP 會放在 /opt/lampp 目錄下,並且建立了 mysql 這個使用者與群組。想要恢復 XAMPP 運作只要先將安裝後的目錄移到家目錄中,並且在 VM 洗掉後復原原安裝目錄與 mysql 帳號、群組即可。可以手動來做,也可以寫支 shell script 程式一次完成這些固定的事情,程式碼如下。將下列程式碼儲存在家目錄,檔名任意(例如 lampp_setup.sh)並修改權限為執行檔。

#!/bin/sh

#LAMPP_UID=999
#LAMPP_GID=1001

if [ -d "/opt/lampp" ] && [ ! -L "/opt/lampp" ]; then
    echo export LAMPP_UID=`id -u mysql` >> $HOME/.bashrc
    echo export LAMPP_GID=`id -g mysql` >> $HOME/.bashrc
    mkdir $HOME/opt
    sudo /opt/lampp/xampp stop 
    sudo mv /opt/lampp $HOME/opt/
    sudo ln -s $HOME/opt/lampp /opt/lampp
    sudo chown -R $USER $HOME/opt/lampp/htdocs
    sudo /opt/lampp/xampp start
fi

if [ ! -L "/opt/lampp" ]; then
    sudo ln -s $HOME/opt/lampp /opt/lampp
    sudo addgroup --gid $LAMPP_GID mysql
    sudo adduser --shell /bin/sh --no-create-home --disabled-password --disabled-login --gecos "" --uid $LAMPP_UID --gid $LAMPP_GID mysql
    sudo /opt/lampp/xampp start
fi

sudo chown -R $USER ./opt/lampp/htdocs
sudo chgrp -R daemon ./opt/lampp/htdocs
sudo chmod -R g+w ./opt/lampp/htdocs

echo "xampp is ready!"

先執行上面的程式一次,他會將 /opt/lampp 移到家目錄的 opt/lampp 中,之後登入 Google Cloud Shell 後先執行這個程式,XAMPP 就又可以正常運作了(預設port為80),但記得要建立 ssh tunnel(請參考),這樣才能在自己的電腦上透過瀏覽器連到 phpmyadmin 管理頁面。

不論是電腦教室有還原系統或是蘋果的 M1 晶片電腦,現在都可以使用 XAMPP 來上資料庫課程了。順道一提,如果要從自己電腦上的程式直接連線進資料庫,記得建立 port 3306 的 ssh tunnel。

SSH Tunnel

需要建立三個,建議埠號如下:

  • cloud 上的 80 => 本地端的 8080(Apache)
  • cloud 上的 3306 => 本地端的 33306(MySQL)
  • cloud 上的 22 => 本地端的 2222(SFTP)

Windows 設定如下:

Putty Ssh Tunnel

Mac 的連線參數如下:

$ gcloud cloud-shell ssh --ssh-flag "-L 8080:localhost:80" --ssh-flag "-L 33306:localhost:3306" --ssh-flag "-L 2222:localhost:22"

使用遠端網頁與遠端資料庫

當網址為 http://localhost:8080 時,看到的內容即是 Google Cloud Shell 上的 XAMPP,當網址為 http://localhost:8080/phpmyadmin 時,就是設定遠端資料庫內容。此時自己的電腦上不需要啟動 XAMPP 任何服務,甚至可以不裝。

使用本地端網頁與遠端資料庫

若想要網頁放在本地端,但資料庫使用遠端時,需要修改本地端的 phpmyadmin 設定檔,Mac 的位置在 /Applications/XAMPP/xamppfiles/phpmyadmin/config.inc.php,Windows  的位置在 C:\xampp\phpMyAdmin\config.inc.php。修改內容如下:

原本

/* Server parameters */
// $cfg['Servers'][$i]['host'] = 'localhost';

改為

/* Server parameters */
$cfg['Servers'][$i]['host'] = '127.0.0.1';
$cfg['Servers'][$i]['port'] = '33306';

特別注意,除了將第二行前頭的註解拿掉外,Mac 上一定要寫成 127.0.0.1 不可以寫成 localhost ,而 Windows 兩者都可以。原因在於 UNIX 的網路連線方式有兩種,若是使用 localhost 時,MySQL 會建立 .sock 檔來做網路資料傳遞,這種速度比較快比較有效率,但因為資料庫實際是在遠端,所以用這種方式必定連線失敗。設定完後網址打 http://localhost/phpmyadmin 看到的網頁就是在本地端,但管理的資料庫則是在遠端,此時自己電腦上的 XAMPP 要啟動 Apache 但 MySQL 不需啟動。

也可以參考這邊文章,讓 phpmyadmin 出現選單,方便選擇連線的是本地端資料庫或是遠端資料庫。

http://114.35.163.224/xampp_phpmyadmin/

檔案傳輸

要將本地端檔案傳到 Google Cloud Shell 上或是抓下來有兩種方式,Git 或是 Ftp。前者需要買本書研究一番,這裡介紹 Ftp 作法。首先找到一個適合的 Ftp Client 端程式,建議 FileZilla。使用 Ftp 連線時要設定 SFTP,這是在 ssh 網路協定上跑 ftp 協定,單純 ftp 協定無法連線到 Google Cloud Shell 上的 XAMPP 內建的 ProFTPD。

設定時,除了連線方式選擇 SFTP 外,驗證方式則是使用金鑰驗證。使用者名稱只需要填 gmail 帳號「@」 前的名稱即可,不要填完整的 gmail 帳號。金鑰檔案在終端機連線到 Google Cloud Shell 時已經產生了,位置不論是 Mac 還是 Windows 都在自己家目錄的 .ssh 資料夾中,但需要的檔名不一樣,Mac 的檔名為 google_compute_engine,Windows 的檔名為 google_compute_engine.ppk。由於 .ssh 在 Mac 上為隱藏資料夾,所以在 FileZilla 的「瀏覽」按鈕無法看到 .ssh 資料夾內容,意味著 Mac 的使用者必須手動填入檔名,如下:

設定完後「連線」按鈕按下就可以連到 Google Cloud Shell 囉。

發表迴響