Home > Web Front-end > JS Tutorial > body text

Detailed explanation of using Node debugging tools

php中世界最好的语言
Release: 2018-05-04 09:17:40
Original
1565 people have browsed it

This time I will bring you a detailed explanation of the use of the Node debugging tool. What are the precautions of the Node debugging tool? The following is a practical case, let's take a look.

In 2016, Node decided to use the "Developer Tools" of the Chrome browser as the official debugging tool, so that Node scripts can also be debugged using the graphical interface, which is greatly convenient. Developer.

This article introduces how to use the debugging tool of Node script.

1. Sample program

For the convenience of explanation, the following is a sample script. First, create a new working directory and enter it.

$ mkdir debug-demo
$ cd debug-demo
Copy after login

Then, generate the package.json file and install the Koa framework and koa-route module.

$ npm init -y
$ npm install --save koa koa-route
Copy after login

Next, create a new script app.js and write the following content.

// app.js
const Koa = require('koa');
const router = require('koa-route');
const app = new Koa();
const main = ctx => {
 ctx.response.body = 'Hello World';
};
const welcome = (ctx, name) => {
 ctx.response.body = 'Hello ' + name;
};
app.use(router.get('/', main));
app.use(router.get('/:name', welcome));
app.listen(3000);
console.log('listening on port 3000');
Copy after login

The above code is a simple Web application that specifies two routes. After access, a line of welcome information will be displayed. If you want to know the detailed meaning of the code in detail, you can refer to the Koa tutorial.

2. Start the developer tools

Now, run the above script.

$ node --inspect app.js
Copy after login

In the above code, the --inspect parameter is required to start the debug mode. At this time, open the browser and visit http://127.0.0.1//3000, and you can see Hello World.

Next, it’s time to start debugging. There are two ways to open the debugging tool. The first is to type chrome://inspect or about:inspect in the address bar of the Chrome browser and press Enter. See the interface below.

In the Target section, click the inspect link to enter the debugging tool.

The second way to enter the debugging tool is to open the "Developer Tools" in the window at http://127.0.0.1//3000. There is a green Node logo in the upper left corner of the top. Click to enter. .

3. Debugging Tool Window

The debugging tool is actually a customized version of the "Developer Tools" , leaving out those parts that are not useful for server scripts.

It mainly has four panels.

  1. Console:Console

  2. Memory:Memory

  3. Profiler:Performance

  4. Sources: Source code

The usage of these panels is basically similar to the browser environment. Only Sources is introduced here ( Source code) panel.

4. Set breakpoints

Enter the Sources panel and find the running script app.js.

Click on the line number of line 11 (that is, the line below) to set a breakpoint.

ctx.response.body = 'Hello ' + name;
Copy after login

At this time, when the browser accesses http://127.0.0.1:3000/alice, the page will show that it is waiting for the server to return. Switch to the debugging tool and you can see that the Node main thread is in the paused stage.

Enter the Console panel, enter name, and alice will be returned. This indicates that we are in the context of the breakpoint.

再切回 Sources 面板,右侧可以看到 Watch、Call Stack、Scope、Breakpoints 等折叠项。打开 Scope 折叠项,可以看到 Local 作用域和 Global 作用域里面的所有变量。

Local 作用域里面,变量 name 的值是 alice ,双击进入编辑状态,把它改成 bob

然后,点击顶部工具栏的继续运行按钮。

页面上就可以看到 Hello bob 了。

命令行下,按下 ctrl + c,终止运行 app.js

五、调试非服务脚本

Web 服务脚本会一直在后台运行,但是大部分脚本只是处理某个任务,运行完就会终止。这时,你可能根本没有时间打开调试工具。等你打开了,脚本早就结束运行了。这时怎么调试呢?

$ node --inspect=9229 -e "setTimeout(function() { console.log('yes'); }, 30000)"
Copy after login

上面代码中, --inspect=9229 指定调试端口为 9229,这是调试工具默认的通信端口。 -e 参数指定一个字符串,作为代码运行。

访问 chrome://inspect ,就可以进入调试工具,调试这段代码了。

代码放在 setTimeout 里面,总是不太方便。那些运行时间较短的脚本,可能根本来不及打开调试工具。这时就要使用下面的方法。

$ node --inspect-brk=9229 app.js
Copy after login

上面代码中, --inspect-brk 指定在第一行就设置断点。也就是说,一开始运行,就是暂停的状态。

六、忘了写 --inspect 怎么办?

打开调试工具的前提是,启动 Node 脚本时就加上 --inspect 参数。如果忘了这个参数,还能不能调试呢?

回答是可以的。首先,正常启动脚本。

$ node app.js
Copy after login

然后,在另一个命令行窗口,查找上面脚本的进程号。

$ ps ax | grep app.js 
30464 pts/11  Sl+  0:00 node app.js
30541 pts/12  S+   0:00 grep app.js
Copy after login

上面命令中, app.js 的进程号是 30464

接着,运行下面的命令。

$ node -e 'process._debugProcess(30464)'
Copy after login

上面命令会建立进程 30464 与调试工具的连接,然后就可以打开调试工具了。

还有一种方法,就是向脚本进程发送 SIGUSR1 信号,也可以建立调试连接。

$ kill -SIGUSR1 30464
Copy after login

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

如何实现vue-router中query动态传参

vue+storejs获取数据使用说明

The above is the detailed content of Detailed explanation of using Node debugging tools. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template