上一章：零：聊一下学啥
说好的十行代码，你们数一数！
var ws = require("nodejs-websocket");
var server = ws.createServer(function (connect)
{
connect.on("text", function (data) {
console.log('收到消息=',data)
})
connect.on("close", function (code, reason) {});
connect.on("error", function (code, reason) {});
}).listen(3000)
console.log('websocket服务端启动')
看不太懂？没关系，只要知道代码有十行，古人诚不我欺 即可！
工欲善其事必先利其器
说代码之前我们先进行一些准备活动。
3个软件，1个系统工具
（1）nodejs 程序安装 下载
（2）vscode 代码编辑器 下载
（3）Cocos Creator客户端游戏编辑器 下载
（4）CMD系统命令行工具
1，NodeJs的安装：
在上述的下载链接选择win安装包的64位，剩下的就是一路下一步即安装完成
2，vscode
此编辑器安装也没有什么太大的难点，一路下一步安装即可。
3，Cocos Creator
这个游戏引擎我们先下载它的安装面板，从面板里面下载引擎。安装面板的安装就是下一步下一步，安装好后注册一个账号登录即可
安装面板安装好后，我们开始下载引擎。
点击下载按钮下载安装最新稳定版本即可
4，CMD命令行
点击win10系统左下角窗口按钮
切换成英文输入法，输入cmd，选中打开如下程序。
到此准备活动全部完毕！
服务端代码：
（1）创建服务端代码
还记得我们上面的十行代码吗？现在先在桌面上新建一个文本文件，重命名为server.js文件
把我们的十行代码直接拷贝进server.js，保存文件！(如果你安装了VScode代码编辑器，双击就可以打开.js文件)
为了看的更方便我们加了一些注释和打印信息，你可以从所有的注释信息里面一行一行看下来就能知道每一行代码都执行了什么逻辑。
//引入websocket模块
let ws = require("nodejs-websocket");
//启动websocket服务器
let server = ws.createServer(function (connect) {
connect.on('text', function (result) {
console.log('接收消息', result)
})
connect.on('close', function (code) {
console.log('关闭连接', code)
})
connect.on('error', function (code) {
console.log('异常关闭', code)
})
//设置端口号为3000
}).listen(3000)
console.log('websocket服务端启动')
（2）跑起服务端代码
进入项目文件夹
为了不让桌面变得非常混乱我们新建一个文件夹server，并且把刚才的server.js文件拖入文件夹中
在启动服务端程序前，我们先来为服务端安装一个websocket的模块，打开CMD命令行程序
输入cd空格后，把桌面上的文件夹直接拖入CMD界面，最后按回车
看到最前面的盘符路径都对了之后再进行下一步操作。
安装NodeJS模块
初始化npm下载工具（这个工具是nodejs自带的下载nodejs库的工具）
npm init -y
安装websocket
npm install nodejs-websocket
在当前项目文件夹下安装nodejs模块，不会影响到其它项目
安装需要一些时间，安装好后看看文件夹里面如果多了下图这些文件就是websocket模块安装成功了
（3）运行nodejs服务端
在CMD命令行中输入如下命令：
node server.js
出现如下提示，证明服务端启动成功！是不是十分简单！
关闭服务端
如果想要关闭服务端只要按照Ctrl按键不放，再按C键即可退出。
客户端
本节课我们先来创建一个简单的客户端！
打开Cocos的安装面板来新建一个项目
选择空模板，在项目名称处起名Client，选择一个保存项目的位置（日后能找的到的）创建并打开项目
右键点击 asset -> 新建 -> Scene
新建一个场景，并双击红框处场景进入当前场景（可以给场景重命名为Client）
再次右键点击 asset -> 新建 -> JavaScript
同时改名脚本Client
脚本绑定场景中节点（为了让场景中的Canvas节点被创建时候自动运行脚本）
拖入成功后会有如下显示
双击刚才创建的Client脚本
在start函数处填写如下代码，基本和服务端差不多
不同处在于填写了连接服务端ip的信息
let ws = new WebSocket("ws://127.0.0.1:3000");
let ws = new WebSocket("ws://127.0.0.1:3000");
ws.onopen = function (event) {
console.log("连接服务端");
};
ws.onmessage = function (event) {
console.log("接收服务端信息: " + event.data);
};
ws.onerror = function (event) {
console.log("异常关闭");
};
ws.onclose = function (event) {
console.log("断开连接");
};
填写后
启动客户端（这里我选择用安卓了chrome浏览器方便调试，强烈建议开发阶段用这个浏览器作为调试工具）
千万记住保存代码和项目后点击启动游戏，启动游戏前按上面的教程
node server.js
在CMD中先启动服务端
那么你将会在浏览器里面看到我们的启动界面（黑漆漆一片？），当然我们要看看之前的打印信息，在浏览器里面（chrome浏览器）快捷键Ctrl+Shift+I进入开发者工具如下图
以上就完成了服务端和客户端的连接！
客户端给服务端发送信息
连接之后，我们来看看从客户端怎么给服务端发送信息。
在客户端连上服务端的时候添加如下代码ws.send('');引号中的消息内容可以自己定义
ws.send('客户端1发来消息');
再次启动服务端和客户端后看到CMD中收到如下信息，大功告成
服务端给客户端发送信息
来而不往非礼也！我们在服务端接收了客户端发过来的消息，正好可以顺势给客户端发送一个欢迎光临的回赠消息
connect.sendText('欢迎光临');
我们可以在服务端接收客户端消息的时机，回送一条消息
于是你就可以在谷歌浏览器中看到如下回复代码：
最后：如果你有什么疑问和建议随时欢迎来到群里和我沟通，我将尽快为您解答247260198
本教程所有代码均在github上分享：下载
下一章：贰：极简聊天系统
网友评论