Uncategorized, 什麼是?, 工具

如何 Debug Node APP 配合 Docker 與 VsCode

透過 vscode Debug 利用中斷點 (breakpoints) 讓開發、偵錯更聰明。

加快除錯速度,而不是用傳統的 console log 方式查看變數、物件內容找問題。

本篇教你如何用 vscode + node + docker 進行 runtime debug!

index

Foreword & Why

(理論上非 docker 也可以用這個方式)

不論是 pm2 或是 node 直接啟動 JS APP 都可以使用~

在 docker container 內啟動 node APP

(選擇你的 app 啟動方法)

  • 方法1: 透過 pm2 啟動
    • target script: '/var/www/express-test/bin/www'
    • node_args: "--inspect-brk=0.0.0.0"
  • 方法2: node 直接啟動
    • node app.js --inspect-brk=0.0.0.0
  • port 預設: 9229

ref.
https://nodejs.org/en/docs/guides/debugging-getting-started/#command-line-options


成功啟動 app 並進入 debug 監聽模式

可以看到 app 啟動後,debugger listening 提示訊息(如下圖)

(訊息開頭 NODE_1 後半段部份)


確認本機與 container 監聽是否串接成功

回到本機

在 chrome 瀏覽器,網址列輸入

chrome://inspect/

Discover network targets Configure...
新增監聽 localhost:9229

如果串接成功
下方
Remote Target 區塊,將出現 node 版本與相應 .js


與 vscode Debug 串接

於 vscode menu bar -> Debug -> open configuration 或 add configuration


編輯 vscode debug 監聽設定 launch.json

{
    'version': '0.2.0',
    'configurations': [
        {
            'name': 'Docker: Attach to Node',
            'type': 'node',
            'request': 'attach',
            'port': 9229,
            'address': 'localhost',
            'localRoot': '${workspaceFolder}',
            'remoteRoot': '/var/www/express-test',
            'protocol': 'inspector'
          }
    ]
}

以上需要注意並調整~

  • port 變更為前面 node inspect-brk 指定的 port
  • remoteRoot 變更為 docker container 內 node 啟用的時目錄位置(也就是專案根目錄)
  • e.g.
    啟動時用的路徑為
    /var/www/express-test/bin/www

    /var/www/express-test/app.js
    專案根目錄則為: /var/www/express-test

.
.
.

vscode 內 按 F5 Start Debugging

接著對程式碼下中斷點 (breakpoints)
https://code.visualstudio.com/docs/editor/debugging#_breakpoints

到 chrome 相對應的頁面,重新整理或執行

碰到中斷點就會自動回到 vscode

可以用滑鼠查看中斷點前變數內容


Conclusion 結語

  • 利用中斷點 debug 可以即時知道變數狀況和 function 動作~
  • 需要注意透過 pm2 啟動的情況下
    不能使用 exec_mode = cluster,instances 應該 = 1
    理論上應該是可行的,只是我沒則試
    但因為是本機 debug 所以我覺得可以先把 cluster 關掉

.
.

Ref.

https://blog.risingstack.com/how-to-debug-a-node-js-app-in-a-docker-container/

Leave a Reply