【技術博客】使用PhpStorm和Xdebug實現Laravel工程的遠程開發及調試

時間 2019-11-21

標籤技術博客使用 phpstorm xdebug 實現 laravel 工程遠程開發調試欄目 PHP 简体版

原文原文鏈接

目錄php

使用PhpStorm和Xdebug實現Laravel工程的遠程開發及調試

使用PhpStorm和Xdebug實現Laravel工程的遠程開發及調試

v1.0html

做者：ZBWlaravel

簡介

咱們的項目在Alpha階段初期開發階段遇到了很多困難，尤爲是在本地部署項目遲遲跑不起來，進度方面產生了一些壓力。除此以外，因爲項目後端代碼中依賴了部分Bash指令，在Windows上運行項目也成爲了一項難題。所以團隊計劃將整個項目部署到一臺開發服務器上，在服務器上運行並檢視代碼的效果。從而如何方便地修改服務端代碼並查看效果成爲了一個亟待解決的問題。web

PhpStorm是Jetbrains公司開發的一款功能強大且易用的、專爲PHP開發設計的IDE。PhpStorm固然也內置了遠程開發相關的一些功能，能夠方便地同步本地和多個服務器之間的代碼，這爲開發和最終的發佈都帶來了便利。本文將介紹PhpStorm在遠程開發方面的使用。chrome

遠程開發考慮的另外一個問題是如何進行debug。代碼運行在服務器而不是本地，而且以往寫程序用print這類函數進行控制檯debug的方式在Laravel工程中難以實現。在調研一番後咱們選擇了Xdebug這款PHP經常使用的調試器，結合PhpStorm進行debug。從而在本地打好斷點後，能夠在本地攔住服務端運行的代碼，並可逐行調試。本文將介紹如何在服務端和本地配置好Xdebug進行調試。apache

PhpStorm中的遠程開發

1. 配置服務器

頂部菜單欄Tools->Deployment->Browse Remote Host開啓右側側邊欄，點擊...打開配置頁面，點擊左上的+添加一個遠程服務器。後端
按下圖配置服務器的基本信息，主要包括服務器ip、端口、驗證信息（賬號密碼，也能夠試用SSH證書），項目在服務器上的根目錄，項目網址地址。配置結束後可使用Test Connection測試鏈接是否正常。瀏覽器

2. 配置路徑對應

1.在Deployment窗口下點擊頂部的Mappings配置本地和服務器路徑的對應關係。本項目按如圖配置便可。服務器

2.配置不須要同步的路徑。點擊頂部的Excluded Paths配置不須要同步的路徑，這些每每是能夠在服務器直接安裝、不會常常變更的代碼，包含隱私信息的文件以及服務端生成的與代碼無關的文件等。app

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中像正常調試同樣查看各類臨時變量了。