[置顶]使用 WebStorm IDE 调试 Pomelo 应用程序

转自 [ETiV][1]

使用得心应手的IDE来开发应用程序,可以使我们的工作事半功倍。而调试则更可以让我们准确的定位BUG,发现问题。<br/>
本文讲述如何使用 WebStorm 这个怪兽级JavaScript IDE来调试 Chat of Pomelo。<br/>
如果你更喜欢 Eclipse 等其他IDE,希望本文也可以有一些帮助。

前言

* 首先我们需要知道,NodeJS应用程序可以在运行命令中加入--debug=5858参数,可以使得NodeJS程序监听本地5858端口,并开启调试模式。

  • 其次,Pomelo的运行原理是:pomelo start时,启动了master服务器,然后其先读取配置文件,再启动由game-server/config/servers.json文件中经过配置的各个服务器进程。其中,你看到的idhostport等等都是子服务器的启动参数,这些参数都会放到启动命令行中app.js的后面。

  • 再次,Pomelo的设计人员最初已经考虑到了直接在nodeapp.js前添加参数的简便方法:在服务器配置文件中,配置条目中插入&quot;args&quot;: &quot; 你想要的参数 &quot;后,便可以你指定的参数运行node

修改配置以启动带有调试模式的服务器

一、打开文件

打开game-server/config/servers.json。为了便于便于开发,我们将服务器数目缩减至每功能1个运行实例。这样你就会看到:

精简过的默认服务器配置

二、修改并保存

我们对gate服务器的负载分配原理产生了兴趣,想要调试它。这时,我们只需要在{&quot;id&quot;: &quot;gate-server-1&quot;, ...的行末,花括号}前,插入下面代码, &quot;args&quot;: &quot; --debug=32312 &quot;。使gete服务器的配置组变成这样:

gate服务器调试配置

当再次启动服务器时,master服务器会读取新的配置,并以这个配置运行gate-server-1服务器。

而该服务器的进程,会监听32312端口,以便调试器连接。将端口设置的偏高是为了减少端口冲突的可能性。开发过程中,如果启动后发现有报ADDRINUSE(端口已被占用)的错误,请使用pomelo kill --force杀光Pomelo程序,并调整此处的端口值。

配置IDE的调试器

一、打开Edit Configurations...对话框

可以从运行、调试按钮前面的小三角进入,或者从工具栏中选择Run - Edit Configurations...

打开Edit Configurations对话框

二、新增一条Node.js Remote Debug

增加 Node.js Remote Debug 配置

gate study 调试器配置

Name栏名字可以随意起,但最好选择明确易懂的。然后选中Single instance only,这样只会启动一个调试器。而不会有很多相同的调试器都连到后面指定的调试端口。

下面的Host写<b>本地127.0.0.1</b>,Debug Port填入刚刚上面指定的端口号,我这里用32312,与前面配置文件中的完全一致。Local directory指定当前的game-server/app.js目录所在目录。

附:运行配置

当然你可能已经注意到了,这里的Configurations不仅包含调试,还包括运行配置。运行配置方法跟一般的NodeJS程序配置方法相同。NodeJS新人可以参考图片中配置。注意被框的内容。

game-server 及 web-server 运行配置举例

准备调试

一、分别启动Web、Chat服务器

如果你有做过运行Chat和Web服务器的配置,现在就可以从运行、调试按钮前面的配置下拉菜单中,分别选择Chat以及Web后,点击[►]运行按钮。运行后,可以从IDE下方的控制台输出中查看日志输出,可以检查一下这两个服务器的启动是否成功。如果出现红字,多半表示启动失败。你可以根据提示的报错信息Google或者 提交Issue ,以查找解决方案。

运行、调试配置选择

二、连接调试器

再从配置下拉菜单中选择刚刚的调试配置gate study,之后点击[☼]调试按钮。检查窗口下方的Debugger,可以看到有提示说Connected to 127.0.0.1:32312

调试器已连接

三、设置断点

由于我们想调试gate服务器中,与connector分配相关的代码,所以在IDE中,打开app/servers/gate/handler/gateHandler.js。定位到 第30行 ,在此处下一个断点。

gateHandler.js 中的断点

实践

浏览器中打开 http://127.0.0.1:3001/index.html 会看到 Chat of Pomelo标题的登录页面。填入两栏表单后,点击【JOIN】按钮。

Chat Of Pomelo 登录页

此时,页面将不会做出任何反应,是因为服务器端的代码被断点拦下了。而IDE会因为调试器而被激活:

开始调试

下方窗口中,除了常规调试用到的StepOver、StepInto、StepOut等必须功能外,有很多好用的工具,比如即时表达式求值、切换异常发生时自动中断……这里就不深入探讨了。

可用的聊天应用

常识

Web服务器启动成功后我们可以看到它提示说可以访问http://127.0.0.1:3001/index.html了。但我们都知道127.0.0.1是本机IP地址,如果真正要跟其他人“聊天”的话,这样是不行的。因为别人不一定能打开127.0.0.1:3001,即便打开了,也无法跟你在一起聊天。

所以将这里的127.0.0.1换成你自己电脑的可被网络上其他成员访问到的地址,我这里的地址是192.168.1.61。OK,我可以在浏览器里打开http://192.168.1.61:3001/index.html,因为本机调试没有任何问题,所以我也信心满满的将这个地址告诉了与我同一网络的同事。

发现问题

<b>这时出现了一个问题,我自己可以登录到聊天界面,而其他任何人都无法登录。</b>

根据其他人的浏览器Console输出,可以看到他们都连接一下192.168.1.61:3014端口后,又去连接127.0.0.1:3050,所以他们才无法登录的。

3014端口刚好是gate服务器,问题就出在这里,还是继续调试一下吧。

在经过一番断点切换后,可以发现gateHandler.queryEntry最后跑到了 第39行next函数上。

var res = dispatcher.dispatch(uid, connectors);
next(null, {
    code: 200,
    host: res.host,
    port: res.clientPort
});

可以看到,返回内容的 host 使用了res.hostres又来自connectorsconnectors来自配置文件。

game-server/config/servers.jsonconnector服务器的 配置条目 ,可以清楚的看见&quot;host&quot;:&quot;127.0.0.1&quot;

解决问题

源头找到了,立刻将这里的127.0.0.1全部替换成我本机192.168.1.61。并且重启Chat服务器。

同事再刷新访问的时候,便可以登录进来了。

写在后面

细心的人或许发现,调试器连接的IP地址,是<b>127.0.0.1</b>,但你或许在想,既然是叫"Remote Deubgger",应该可以连接除127.0.0.1以外的IP吧?
我也是这么想的。但是,在不借助其他工具的情况下,不能办到。

就是说,不借助一个代理工具,是没办法连接到除了127.0.0.1地址的调试端口的。

你可以借助NodeJS官方 Wiki 文章结尾(Ctrl-F后,搜索"You probably noticed")的方法及代码,来完成一个代理工具。以便调试部署在远端服务器上运行的代码。

同时这篇文章也是 Eclipse 的调试指导文章。

标签:无
fantasyni 在 2013-3-27 09:56发布
fantasyni 在 2013-3-27 10:06重新编辑 分享到 weibo
30 回复
#1 {4} ETiVcn 2013-3-27 10:03 回复
fantasyni 2013-3-27 10:05 回复

赞,以后要多发开发经验哈

Geforce 2013-3-27 11:11 回复

支持~~

ETiVcn 2013-3-27 12:51 回复

@fantasyni

https://github.com/NetEase/pomelo/wiki/Debugging-Pomelo-ServerApps-With-WebStorm-IDE

英文的也完成了。我英语四级没过,求斧正。

한국어...就有点无力了. 三脚猫功夫.

fantasyni 2013-3-27 13:58 回复

@ETiVcn 赞啊

#2 innobeanslong 2013-3-27 10:48 回复

学习了,之前一直用node-inspector调试的,感觉也挺不错

#3 demon 2013-3-27 15:52 回复

赞 太NB了

#4 xiecc 2013-3-27 15:56 回复

文档写的真好

#5 demon 2013-3-27 16:02 回复

赞!我把你的wiki链接加在官方Wiki主页上了,欢迎分享高质量的开发文档。

#7 tengchuan 2013-5-7 09:47 回复

这文章帮到我了

#9 weiyongqing123 2013-5-24 13:49 回复

我升级pomelo到0.4,服务启动后就打不开32312端口了,原先的0.3行。

#10 {1} fantasyni 2013-5-24 17:47 回复

@weiyongqing123 你配置 debug 端口了没

jiangzhuo 2013-5-29 01:29 回复

https://github.com/NetEase/pomelo/pull/226
这应该是starter在从exec修改为spawn的时候产生的bug
已经pull request
@weiyongqing123 可以根据这个pull request自己先修改一下
我试过修改后可以继续使用"args":" --debug=32312 "这样的配置

#11 weiyongqing123 2013-5-27 15:13 回复

配置了,参数是:"args":" --debug=32312 "

#12 xiecc 2013-5-29 10:23 回复

呵呵, 谢谢jiangzhuo的push request, 已merge

#13 weiyongqing123 2013-5-29 11:51 回复

嗯,多谢。咱们社区真好啊,我熟悉了,也去帮助别人。

#14 magiclizi 2013-5-30 16:02 回复

[2013-05-30 15:58:43.124] [ERROR] [default] - Execute command C:\Program Files\nodejs\node.exefail. error code: debugger listening on port 32313

我按照GIT上修改了以后就一直报这个错有谁知道为什么哇。。

#15 {1} magiclizi 2013-5-30 16:02 回复

[2013-05-30 15:58:43.007] [INFO] [default] - Executing C:\Program Files\nodejs\node.exe --debug=32313 ,C:\Users\jay.liu\Desktop\GameTest\game-server\app.js,env=development,id=connector-server-1,host=127.0.0.1,port=3150,clientPort=3010,frontend=true,args=--debug=32313 ,serverType=connector locally
[2013-05-30 15:58:43.012] [INFO] [default] - Executing C:\Program Files\nodejs\node.exe C:\Users\jay.liu\Desktop\GameTest\game-server\app.js,env=development,id=login-server-1,host=127.0.0.1,port=6010,serverType=login locally
[2013-05-30 15:58:43.016] [INFO] \node_modules\pomelo\node_modules\pomelo-admin\lib\consoleService.js - try to connect master: "master", "127.0.0.1", 3005
[2013-05-30 15:58:43.124] [ERROR] [default] - Execute command C:\Program Files\nodejs\node.exefail. error code: debugger listening on port 32313

如上是执行情况

jiangzhuo 2013-5-30 17:55 回复

debugger listening on XXXX 的确是stderr出来的
一直是这样 所以不用在意 就是这么输出的 其实不算报错

#16 tanjr 2013-6-4 00:52 回复
开发环境是windows,运行环境是linux,Remote Deubgger就很重要了。
期待有人能共享 Remote Deubgger 的经验!
#17 loverains 2013-6-6 19:10 回复

按照教学文档配置后,启动没有发现监听相应端口,启动debugger始终提示连接中,何解呢?

#18 {2} laoyur 2013-11-7 15:16 回复

问题1:
ws 7.0 console 中输出 /usr/local/bin/node --debug-brk=52486 app.js env=development
求解--debug-brk这个参数是干吗的?是ws默认给你加上的吗?
我不在servers.json中增加"args":" --debug=33333",照样能断点调试。那加上了有什么意义呢?

问题2:
pomelo应用会无配置方式先执行node app.js,即启动master服务器,然后它会启动各前端服务器和后端服务器,也就是说会带配置方式启动node app.js子进程。
我在app.js中加了断点,可是只能调试到master进程的那次断点,后续的子进程的断点怎么调试呢?

jiangzhuo 2013-11-29 17:10 回复

回答你第一個問題 配置--debug-brk的意義在於 你指定一個可以調試的端口,而且在這個端口有連接之前程序是一直等待的 不會運行
你不能斷點其他服務器的 只能斷點當前服服務器(master)的 因為你只連接上了隨機生成的52486端口

laoyur 2013-12-3 10:05 回复

@jiangzhuo 感谢回复!
1. --debug-brk=xxxxx,是ws默认随机加的?这个选项我在ws设置中没有找到哪里可以配置开启/关闭/固定端口号
2. 加了--debug-brk=后,只能断点master服务器,如果我还想断点其他服务器,是不是需要用本文所述的方法,在希望被调试的服务器的配置文件中加上"args":" --debug=33333"

关于问题2,我会再验证一下的,感谢哥们!

#19 roytan 2013-11-27 10:29 回复

连接linux nodejs的时候ws7.0 Debugger connecting 之后提示Unsupported version:null
怎么破?
我看Linux上面的对应端口已经打开了。

#20 {1} roytan 2013-11-27 10:36 回复

哦,原来只能本机调试。。。
那这个东西意义不大了,pomelo都是跑linux上的。

IcepOwer 2013-12-2 13:56 回复

文章最后说可以远程调试的呀,不过我还没试。

#21 unrealinux 2014-1-11 19:47 回复

个人建议能够把工程建立的那部分也加上就好了,感觉文档还是有点跳跃,如果对此工具的不熟或者想熟悉此开发过程的人来讲刚开始的东西跳得有点稍多了,请作者多费心,补上一些最前面的工作,例如建立工程的那部分,为我这个刚熟悉这个工具的初学者多些指导,呵呵

#22 unrealinux 2014-1-12 00:46 回复

个人建议结合这篇说明和以下链接的说明可以比较顺利的完成入门,尤其是对webstorm不怎么熟悉的
http://blog.csdn.net/wangqiuyun/article/details/9794711

#23 kimifly 2014-6-25 07:43 回复

“二、新增一条Node.js Remote Debug”
这个不能用呀,可以说明下你们的是什么版本吗?我从官网下的8.0.4的,没有路径配置呀。断点无效

#24 showland 2014-9-28 17:12 回复

不错 感谢

#25 renkaili 2014-10-27 16:41 回复

为啥我的进不了断点呢?

#26 {1} jamy325 2015-2-2 13:31 回复

非常感谢这篇文章, 按照这篇文章的方法可以成功调试, 但是有个问题我一直无法理解,
为何在webstorm里调试时没有continue按钮,不能很方便的跳到下一个断点, 相当的不方便,如果有知道怎么解决的请告知一下。多谢了!

sinelabo 2015-5-3 01:24 回复

enter image description here
这个就是

#27 funway 2015-4-18 15:37 回复

感谢 学习了

#28 tufeiax 2015-6-24 16:26 回复

我的WebStorm编辑配置的地方,不能新建Nod.js,有人知道是怎么回事吗? node.js remote可以,但是没有设置目录那一块。

#29 crylg 8-10 20:04 回复

这个只能调试到servers/gate
那如果要调试servers/chat和servers/connector怎么弄?

#30 lixzrio 9-3 23:37 回复

我最近在WebStorm2017.2调试,出现这个错误:Error running 'utils.js': Program path not specified;我想大概需要指定Remote Debug的local directory,但是2017.2没有这个设置,要怎么办呢?

回到顶部