使用PhpStorm和Xdebug實現Laravel工程的遠程開發及調試
v1.0
作者：ZBW
簡介
我們的項目在Alpha階段初期開發階段遇到了不少困難，尤其是在本地部署項目遲遲跑不起來，進度方面產生了一些壓力。除此之外，由於項目后端代碼中依賴了部分Bash指令，在Windows上運行項目也成為了一項難題。因此團隊計划將整個項目部署到一台開發服務器上，在服務器上運行並檢視代碼的效果。從而如何方便地修改服務端代碼並查看效果成為了一個亟待解決的問題。
PhpStorm是Jetbrains公司開發的一款功能強大且易用的、專為PHP開發設計的IDE。PhpStorm當然也內置了遠程開發相關的一些功能，可以方便地同步本地和多個服務器之間的代碼，這為開發和最終的發布都帶來了便利。本文將介紹PhpStorm在遠程開發方面的使用。
遠程開發考慮的另一個問題是如何進行debug。代碼運行在服務器而不是本地，並且以往寫程序用print這類函數進行控制台debug的方式在Laravel工程中難以實現。在調研一番后我們選擇了Xdebug這款PHP常用的調試器，結合PhpStorm進行debug。從而在本地打好斷點后，可以在本地攔住服務端運行的代碼，並可逐行調試。本文將介紹如何在服務端和本地配置好Xdebug進行調試。
PhpStorm中的遠程開發
1. 配置服務器
-
頂部菜單欄
Tools->Deployment->Browse Remote Host開啟右側側邊欄，點擊...打開配置頁面，點擊左上的+添加一個遠程服務器。 -
按下圖配置服務器的基本信息，主要包括服務器ip、端口、驗證信息（帳號密碼，也可以試用SSH證書），項目在服務器上的根目錄，項目網址地址。配置結束后可以使用
Test Connection測試連接是否正常。
2. 配置路徑對應
1.在Deployment窗口下點擊頂部的Mappings配置本地和服務器路徑的對應關系。本項目按如圖配置即可。
2.配置不需要同步的路徑。點擊頂部的Excluded Paths配置不需要同步的路徑，這些往往是可以在服務器直接安裝、不會經常變動的代碼，包含隱私信息的文件以及服務端生成的與代碼無關的文件等。
3. 配置同步
頂部菜單欄Tools->Deployment->Options打開同步相關設置。
此處需要額外注意的是關於自動上傳功能，該功能請謹慎開啟！！！謹慎開啟！！！謹慎開啟！！！
原因是自動上傳很可能會直接覆蓋掉服務器上的文件，甚至刪除服務器上的文件（如果本地沒有而服務器上有），並且沒有回撤的方式。當你的本地目錄發生比較大的變化（例如切換Git分支），如果不慎按下了Ctrl+S，則PhpStorm在上傳時不分三七二十一就會覆蓋掉之前的所有文件，並且刪除服務器上一些沒有的文件。
（筆者在發布前一天切換分支查看注釋率時，手賤按了一下Ctrl+S，結果差點把服務器上的文件全都搞亂）
4. 進行代碼同步
代碼同步有多種方式可以進行。
1.指定文件手動選擇同步方式（上傳/下載）：右鍵在文件樹中點擊選中的單個或多個文件，進入Deployment選項菜單，選擇所需的方式即可進行。
2.同步整個文件夾內的文件
上圖中介紹的sync便具有這樣的功能，其可以自動按多種方式對比本地和服務端文件的差異，並由你選擇不同的同步方式。
3.自動同步，即上文提到的自動上傳。上傳時如果遇到時間沖突會提醒你進行Merge（類似Git），但也有可能直接就覆蓋了。無論如何該方法請謹慎使用。
5. 優點和缺陷
優點：
- 開發時本地修改代碼之后可以直接上傳到服務器上驗證效果，在IDE內一氣呵成。
- 方便管理服務器上的代碼，在發布時只需要對服務器進行一次同步即可。
- 需要臨時、快速地修改服務器上的文件時可以直接在IDE內操作（例如修復小bug）。
缺點：
- 多人使用該功能時會非常混亂，很可能出現前腳改完后腳被覆蓋了的情況。
- 沒有回退機制，尤其是一旦誤刪了服務器上的文件很難恢復。
- 同步體驗一般，有時需要手動對每個文件進行核對以及確認同步操作，並且對比二進制文件速度較慢。
總體來說在IDE中使用這一功能需要根據項目開發的模式以及人員的數量進行調整。
利用Xdebug進行后端調試
1. 服務端配置
1.安裝Xdebug：Installation Guide。在Ubuntu環境下可以選擇手動編譯安裝，根據教程選擇合適的版本后在服務端編譯即可。
當然你也可以選擇：apt install php-xdebug，但在Ubuntu 16.04下該方式安裝的版本較低（雖然夠用，但不利於升級）
2.配置Xdebug
使用apt安裝的話，在/etc/php/7.0/mods-available/下新建文件xdebug.ini，填入以下內容。
zend_extension=xdebug.so
xdebug.remote_autostart = 1 # 自動啟動xdebug
xdebug.remote_enable = 1 #是否開啟遠程調試
xdebug.remote_handler = dbgp #指定遠程調試的處理協議
xdebug.remote_host= 127.0.0.1 #指定遠程調試的主機名，如果你的IDE運行在有公網ip或者開發服務器和PC運行在同一個內網中，那么此處你可以直接設置成本機的公網/內網ip
xdebug.remote_port = 9001 #指定遠程調試的端口號，本文不使用默認的9000了
xdebug.remote_log = /tmp/xdebug_remote.log # 日志位置
如果編譯安裝，則需要手動配置php的全局配置php.ini中的相關內容。以上配置結束后，重啟apache服務器，並使用php -v查看輸出是否有xdebug字樣，如果有則配置成功了。
2. PhpStorm內配置
1.設置PHP解釋器：進入Settings->Languages&Frameworks->PHP，在CLI Interpreter出點擊右側的...設置遠程解釋器。在Path mappings處設置目錄對應。
2.進入左側欄目中PHP->Debug條目，設置Xdebug端口號
3.新建一個運行配置，點擊IDE右上角的Add Configuration
進入后首先添加一個運行配置，如圖選擇PHP Remote Debug，然后新增一個服務器，配置服務器相關信息以及路徑對應。最后記得配置好IDE key
3. 瀏覽器配置
本文以Chrome瀏覽器為例。在瀏覽器中安裝一個叫做Xdebug helper的插件。其他瀏覽器可以在這里選擇類似的插件：Browser Debugging Extensions
安裝好插件后，首先配置其IDE key。打開設置，選擇PhpStorm即可。
4. 開始調試
以上內容配置完畢后，我們終於可以開始調試了。不過還有一些准備工作：
-
打開瀏覽器插件，點擊小蟲子圖標后選擇Debug項即可。
-
打開PhpStorm中的xdebug監聽，點擊
如圖顯示即可。 -
（非常重要）建立一個反向SSH連接。由於是需要服務器向我們的PC發送請求，而我們的PC又沒有可以直連的公網IP（如果你有那么請忽略本條。並將之前在服務器上設置的remote_host設置為你的本機ip），因此我們需要通過SSH建立一個反向的鏈接，將本地9001端口反代到服務端。指令如下：
ssh -R 9001:localhost:9001 user@hostname
以上都配置好了之后，在需要調試的代碼中打好斷點，然后點擊綠色小蟲子新建一個Debug會話，同時打開瀏覽器進入對應的頁面，就可以開始Debug了！
當服務端運行到斷點處時，會在IDE中停下，網頁往往也會卡住。此時你就可以在IDE中像正常調試一樣查看各種臨時變量了。