Node.js 深度調(diào)試方法解析
在 Node.js 項目開發(fā)過程中，隨著項目的發(fā)展，調(diào)用關(guān)系越來越復(fù)雜，調(diào)試工具的重要性日益凸顯。
Node(v6.3+)集成了方便好用 V8 Inspect 調(diào)試器，允許我們通過 Chrome DevTools 進行圖形化的調(diào)試和性能分析。同時，我們也可以使用 VS Code，Webstorm 等支持的編輯器對 Node.js 程序進行調(diào)試。
Node Inspect
要想啟動調(diào)試器，我們需要在啟動 Node.js 應(yīng)用程序時傳入 --inspect 標(biāo)志，也可以使用該標(biāo)志提供自定義的端口，例如 --inspect=9222 將會在 9222 端口上接受開發(fā)者工具的連接。
一段簡單的代碼
function log() {
let a = 1;
console.log(a);
a = 2;
console.log(a);
}
log();
使用 node --inspect 啟動
這時我們會發(fā)現(xiàn)，程序直接執(zhí)行完成了，沒有中斷，導(dǎo)致我們無法使用 Chrome DevTools 進行調(diào)試。對于這種直接執(zhí)行的代碼，我們可以使用 --inspect-brk 參數(shù)，在應(yīng)用程序代碼的第一行終端，然后再進行調(diào)試。
Chrome DevTools
當(dāng)開啟 Node 調(diào)試后，我們可以打開 Chrome，訪問 chrome://inspect ，在 Devices 中查找到我們的 Node.js 程序，點擊 inspect 打開調(diào)試面板進行操作
在調(diào)試工具窗口，我們可以設(shè)置斷點，運行程序進行調(diào)試
運行中程序調(diào)試
在某些情況下，我們可以需要對正在運行的 Node.js 程序進行調(diào)試，比如 Express Web 服務(wù)。我們不可能停止服務(wù)，再以 --inspect 運行調(diào)試。
對于這種情況，我們可以先獲取服務(wù)的進程 Id
向腳本進程發(fā)送 SIGUSR1 信號，就可以建立調(diào)試連接
kill -SIGUSR1 34943
復(fù)制代碼
在 Windows 平臺下，可以使用下面的命令
node -e 'process._debugProcess(30464)'
需要注意的是：這種調(diào)試任然會中斷服務(wù)進程的執(zhí)行。
VS Code 調(diào)試
快速調(diào)試
對于簡單的應(yīng)用程序，可以打開文件，按 F5 并選擇調(diào)試類型為 Node，即可進行調(diào)試
使用配置調(diào)試
對于大多數(shù)的調(diào)試場景，更推薦使用配置文件，因為它可以配置并保存調(diào)試設(shè)置的信息，方便我們下次快速使用。在 VC Code 中，調(diào)試配置通常存儲在 .vscode 文件夾下的 launch.json 文件中 ?？梢渣c擊左側(cè)欄目中的調(diào)試圖標(biāo)，快速創(chuàng)建 launch.json 文件
VS Code 會自動下面類似的 launch.json 調(diào)試配置文件，其中 program 代表我們需要調(diào)試的文件路徑，workspaceFolder 為當(dāng)前工作區(qū)的路徑，通常是項目的根目錄
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "啟動程序",
"skipFiles": ["<node_internals>/**"],
"program": "${workspaceFolder}/index.js"
}
]
}
設(shè)置斷點，即可啟動調(diào)試，并在左側(cè)的樹視圖中看到變量對應(yīng)的值以及堆棧信息
launch.json
launch.json 中有許多不同的屬性，支持不同的調(diào)試器和調(diào)試場景，下面的屬性在每個啟動配置中是必須的
- name - 當(dāng)前調(diào)試配置項的名稱，可讀性要好，區(qū)分每個調(diào)試配置項
- type - 用于此啟動配置的調(diào)試器的類型。每個已安裝的調(diào)試擴展都引入一種類型：例如node，php，go 等。
- request - 當(dāng)前調(diào)試項的類型，目前支持 launch 和 attach 兩種類型。launch 適合調(diào)試未啟動的程序，attach 則適合調(diào)試已經(jīng)運行的程序。
一些其他比較有用的選項：
- program - 啟動調(diào)試器時要運行的可執(zhí)行程序或文件
- args - 傳遞給程序進行調(diào)試的參數(shù)
- env - 調(diào)試時的環(huán)境變量
- envFile - 包含環(huán)境變量鍵值對的文件
- stopOnEntry - 程序啟動時立即中斷
- port - 連接到正在運行的調(diào)試器的端口
- runtimeExecutable - 啟用調(diào)試的可執(zhí)行 Runtime，默認是 Node
日志點 - Logpoints
VS Code 提供了好用的調(diào)試小工具 - 日志點，日志點是斷點的一種變體，它不 "中斷 "進入調(diào)試器，而是將一條消息記錄到控制臺，日志點對于在調(diào)試不能暫停或停止的生產(chǎn)服務(wù)器時注入日志特別有用。
NPM 腳本調(diào)試
除了使用 node 啟動 Node.js 項目之外，VS Code 還支持自定義啟動程序 runtime，借助這個能力，可以直接使用 NPM 啟動調(diào)試。如下面，使用 npm run debug 啟動調(diào)試
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "啟動程序",
"skipFiles": ["<node_internals>/**"],
"program": "${workspaceFolder}/index.js"
}
]
}
launch.json
{
"type": "node",
"request": "launch",
"name": "NPM 啟動",
"runtimeExecutable": "npm",
"runtimeArgs": ["run", "debug"],
"port": 9229
}
TypeScript 調(diào)試
VS Code 內(nèi)置的 Node.js 的調(diào)試器支持 JavaScript Source Map，可以結(jié)合 Source Map 調(diào)試轉(zhuǎn)譯前的代碼，如 TypeScript，壓縮混淆的 JavaScript 代碼等都可以利用 Source Map 的支持調(diào)試源碼。
我準(zhǔn)備了一個簡單的 TS Server Demo，可以直接 Clone 源碼本地測試。下面是項目中的 src/index.ts 文件，創(chuàng)建了一個 HTTP Server
import * as http from "http";
let reqCount = 1;
http
.createServer((req, res) => {
const message = `Request Count: ${reqCount}`;
res.writeHead(200, { "Content-Type": "text/html" });
res.end(`<html><div>${message}</div></html>`);
console.log("handled request: " + reqCount++);
})
.listen(3000);
console.log("server running on port 3000");
創(chuàng)建 tsconfig.json 配置，配置編譯生成 Source Map
{
"compilerOptions": {
"outDir": "./dist",
"sourceMap": true
},
"include": ["src/**/*"]
}
使用 tsc 編譯一下，生成 JS 代碼：dist/index.js，創(chuàng)建調(diào)試配置，入口文件為 dist/index.js
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceFolder}/dist/index.js",
"skipFiles": ["<node_internals>/**"]
}
然后打斷點，啟動調(diào)試，瀏覽器訪問 http://localhost:3000，即可看到調(diào)試進入了 TS 文件
遠程調(diào)試
當(dāng)我們需要在真實的服務(wù)器等遠程運行環(huán)境調(diào)試 Node.js 時，我們可以利用上面提到的方式，在服務(wù)器上開啟 Node.js 調(diào)試功能，并在本地連接上遠程的調(diào)試端口進行調(diào)試。
VS Code 默認支持遠程調(diào)試，我們需要 launch.json 配置文件中指定遠程服務(wù)的 IP 地址以及端口，如下所示：
{
"type": "node",
"request": "attach",
"name": "遠程調(diào)試",
"address": "IP 地址",
"port": "9229"
}
VS Code 會自動加載遠程的文件，展示為只讀代碼供調(diào)試使用。
如果想要在調(diào)試的過程中編輯源代碼，或者更好的調(diào)試體驗，可以在遠程文件夾和本地項目之間設(shè)置一個映射。VS Code 提供了 localRoot 和 remoteRoot 屬性來映射本地 VS Code 項目和（遠程）Node.js 文件夾：
{
"type": "node",
"request": "attach",
"name": "遠程調(diào)試",
"address": "IP 地址",
"port": "9229",
"localRoot": "${workspaceFolder}/src",
"remoteRoot": "/var/user/"
}
在建立映射關(guān)系后，即可在本地項目進行斷點調(diào)試，遠程的斷點信息會同步到本地項目，使用起來十分方便。
子進程調(diào)試
與普通進程調(diào)試原理一致，子進程調(diào)試時也需要傳入 --inspect 參數(shù)，這一點需要特別注意，否則無法啟動子進程調(diào)試。
如下通過子進程啟動 Server 的例子：
// fork.js 文件
const { spawn } = require("child_process");
const sp = spawn("node", ["./fork_server.js"]);
console.log("父進程 PID", sp.pid);
sp.stdout.on("data", (data) => {
console.log(`stdout: ${data}`);
});
sp.stderr.on("data", (data) => {
console.error(`stderr: ${data}`);
});
如果直接使用 node --inspect 啟動主進程的話，會發(fā)現(xiàn)只顯示了主進程的調(diào)試端口，這就是因為我們在程序中啟動子進程時沒有傳遞 --inspect 選項導(dǎo)致的。
這里我們在啟動進程時添加上 --inspect 參數(shù)，同時注意要指定一個默認 9229 端口之外的端口號，避免調(diào)試端口沖突
- const sp = spawn("node", ["./fork_server.js"]);
+ const sp = spawn("node", ["--inspect=9230", "./fork_server.js"]);
再次啟動，就能看到兩個調(diào)試信息輸出了
當(dāng)然，怎么能少得了強大的 VS Code 呢。VS Code 的 Node 調(diào)試器提供了一種機制，可以追蹤所有子進程，并在調(diào)試模式下，自動鏈接進程?？梢酝ㄟ^ autoAttachChildProcesses 屬性開啟此機制：
{
"type": "node",
"request": "launch",
"name": "啟動程序",
"program": "${workspaceFolder}/fork.js",
"autoAttachChildProcesses": true
}
啟動后，即可對父進程，或子進程進行斷點調(diào)試，效果如下
結(jié)語
到此這篇關(guān)于Node.js 深度調(diào)試方法解析的文章就介紹到這了,更多相關(guān)Node.js 深度調(diào)方法內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
對于腳手架我們可能天天都在接觸,像npm包管理工具,vue-cli,webpack…,但是這些腳手架是怎么做出來的,我們自己能不能做一個出來玩玩,下面這篇文章主要給大家介紹了關(guān)于如何利用NodeJs構(gòu)建屬于自己的前端腳手工具的相關(guān)資料,需要的朋友可以參考下2022-05-05
Node.js服務(wù)端實戰(zhàn)之服務(wù)啟動過程詳解
這篇文章主要為大家介紹了Node.js服務(wù)端實戰(zhàn)之服務(wù)啟動過程詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-12-12
這篇文章主要介紹了關(guān)于Node.js中的JXcore打包示例,JXcore 是一個支持多線程的 Node.js 發(fā)行版本，基本不需要對你現(xiàn)有的代碼做任何改動就可以直接線程安全地以多線程運行,需要的朋友可以參考下2023-05-05
這篇文章主要給大家介紹了關(guān)于express項目文件目錄說明以及功能描述的相關(guān)資料，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-04-04
node.js中RPC(遠程過程調(diào)用)的實現(xiàn)原理介紹
這篇文章主要介紹了node.js中RPC(遠程過程調(diào)用)的實現(xiàn)原理介紹,本文基于一個簡單的RPC庫nodejs light_rpc實現(xiàn),需要的朋友可以參考下2014-12-12
本篇文章主要介紹了深入nodejs中流(stream)的理解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-03-03
本篇文章主要介紹了nodejs mysql 實現(xiàn)分頁的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
本文主題是使用node來搭建最簡單的web服務(wù)器，其后可以自己根據(jù)需要深入了解，目前在開發(fā)過程中可以用來模擬與服務(wù)器進行簡單的交互，比如返回的資源控制等。需要的朋友可以參考學(xué)習(xí)，下面來一起看看吧。2017-02-02
這篇文章主要介紹了windows系統(tǒng)下更新nodejs版本的方案,在文章給大家介紹了NodeJS 與 npm 在Windows下升級問題,需要的朋友可以參考下2017-11-11
Node.js是一種對應(yīng)于JavaScript運行時環(huán)境的編程語言,這篇文章主要給大家介紹了關(guān)于Linux?Ubuntu升級nodejs版本的簡單步驟,文中通過圖文介紹的非常詳細,需要的朋友可以參考下2023-12-12