nodejs 平台的 webscoket 的实现
新手入门，没办法，只能选择不断不断的google吧。
找了很多的例子都跑不了，不知道什么原因。
后，自己在git搜索吧，选择了一个下面的例子： nodejs-web-socket
经过我的改造，改成我自己想要的方式。
只是将客户端发送的数据直接原封不动发回客户端。
先说说运行环境：window 7 ，node v0.10.5，全局安装了websocket.io模块，chrome 28浏览器。
（注：以下提到的两个js文件放在同一层目录下面即可，html文件随便放置）
这是后台的js代码：
1、将其存为socketServer.js文件里面，并且进行module导出。
/*
仅用于测试，
客户端发送的东西将被服务器原封不动的返回到客户端
运行环境：node v0.10.5
window 7
chromw 28
*/
/*var server = */module.exports = ( function() {
var ws = require('websocket.io');
var socketServer = null;
var socketInitListen = function(port) {
socketServer = ws.listen(port);
socketServer.on('listening',function() {
console.log('Socket server running');
});
socketServer.on('connection',function(socket) {
console.log('Connected to client');
socket.on('message', function(data) {
// client send message to server
console.log('Server received message : ',data);
socket.send(data);
});
socket.on('close',function() {
socket.send('close');
})
})
};
var init = function(socketPort) {
socketInitListen(socketPort);
};
return {
init: init
};
})(); // server.init(9000);
2、引用上面那个module的文件，并且将端口绑定为9000端口，存为文件server.js。
var socketServer = require('./socketServer').init(9000);
3、页面的代码 ：index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WebSockets Node.js</title>
<style>
.container{
margin:auto;
width:300px;
}
label,input{
width:200px;
float:left;
}
input[type=button]{
float:right;
width:80px;
}
</style>
<script src="http://code.jquery.com/jquery.min.js"></script>
</head>
<body>
<div class="container">
<label for="content">发送的内容:</label><input type="text" id="content" value="input something" />
<label for="recive">收到的内容:</label><input type="text" id="recive" />
<input type="button" id="send" value="点击发送" />
</div>
<script>
// websocket 连接变量
var wsConn;
(function () {
try {
wsConn = new WebSocket('ws://127.0.0.1:9000');
} catch (e) {
console.log("websocket 连接出错。");
console.log(e);
}
})(); $(function() {
if (wsConn) {
wsConn.onopen = function() {
console.log("open Connection.");
};
wsConn.onmessage = function(msg) {
console.log("onmessage.");
console.log(msg.data);
$('#recive').val(msg.data);
};
wsConn.onerror = function(msg) {
console.log("onerror.");
console.log(msg);
};
wsConn.onclose = function(msg) {
console.log("onclose.");
console.log(msg);
};
function wsConnSend(content) {
wsConn.send(content);
};
$('#send').bind('click',function sendClick() {
wsConnSend($('#content').val())
})
}
});
</script>
</body>
</html>
这都是源码的三个文件。
运行的方法为：
1、安装node ，我的版本是0.10.5，其他版本没进行测试；
2、安装websocket.io，命令如下 npm i -g websocket.io；
3、环境弄好了，可以跑了，打开命令行，cd到当前目录，跑 node server.js。
4、直接用chrome以本地文件方式直接打开index.html ，里面操作简单。其他浏览器没进行测试。
搭建完毕。
这是控制台下面的一行命令的截图。
新手习作，若有出错，敬请大神指出。
nodejs 平台的 webscoket 的实现的更多相关文章
- NodeJS平台下的前后端文件共享
一.前后端文件共享的需要背景——为什么需要共享? 项目基本JS/NodeJS全端开发,有部分代码前后端都需要用得到 有一些配置是在前后端都需要用得到的 区别其他开发平台,NodeJS平台下的前后端文件 ...
- Node.app让Nodejs平台在iOS和OS X系统上奔跑
首先呢,欢迎大家去查看相同内容的链接:http://www.livyfeel.com/nodeapp/. 由于那个平台我用的markdown语法,我也懒得改动了,就这样黏贴过来了. 这是一个惊人的恐怖 ...
- 3分钟干货学会使用node-inspector调试NodeJS代码
使用node-inspector调试NodeJS代码 任何一门完备的语言技术栈都少不了健壮的调试工具,对于NodeJS平台同样如此,笔者研究了几种调试NodeJS代码的方式,通过对比,还是觉得node ...
- 【转】前端工程筹建NodeJs+gulp+bower
转自:http://www.myexception.cn/javascript/1781968.html npm nodejs 安装过程中会自动安装npm,nodejs安装程序会在环境变量中添加两个变 ...
- NodeJS 常用模块
NodeJS 模块: n:NodeJS 版本管理/切换 参考: https://github.com/tj/n ExpressJS:Web 框架 参考: http://expressjs.com/ m ...
- angularjs, nodejs, express, gulp, karma, jasmine 前端方案整合
今年转向做前端开发,主要是做angularjs开发,期间接触了nodejs平台,从此一发不可收拾. npm丰富的插件库,express 开发框架, grunt, gulp构建工具,karma测试管理工 ...
- 前端MVC学习总结（四）——NodeJS+MongoDB+AngularJS+Bootstrap书店示例
这章的目的是为了把前面所学习的内容整合一下,这个示例完成一个简单图书管理模块,因为中间需要使用到Bootstrap这里先介绍Bootstrap. 示例名称:天狗书店 功能:完成前后端分离的图书管理功能 ...
- 前端工程筹建NodeJs+gulp+bower
1.安装nodejs nodejs 官网下载安装文件 安装完成之后,在命令窗口执行,(显示nodejs版本) 和(显示npm版本)可以使用这两个命令查看是否安装成功: node -v npm -v 2 ...
- 前端MVC学习笔记（四）——NodeJS+MongoDB+AngularJS+Bootstrap书店示例
这章的目的是为了把前面所学习的内容整合一下,这个示例完成一个简单图书管理模块,因为中间需要使用到Bootstrap这里先介绍Bootstrap. 示例名称:天狗书店 功能:完成前后端分离的图书管理功能 ...
随机推荐
- mfc 链接时错误 文件函数重复定义
我在HeaderFile里新建了一个函数,然后在程序里调用,一直出现这个错误,说这个函数重复定义, 发现是VS自动加到External dependencies里面了.把HeaderFile里的函数文 ...
- 巧妙设备MTU的大小，轻松提网速
MTU是什么? "MTU=最大传输单元 单位:字节" 我们在使用互联网时进行的各种网络操作,都是通过一个又一个"数据包"传输来实现的.而MTU指定了网络中可数据 ...
- Event Sourcing - ENode（二）
接上篇文章继续 http://www.cnblogs.com/dopeter/p/4899721.html 分布式系统 前篇谈到了我们为何要使用分布式系统,因为ENode本身就是一个分布式的框架.看了 ...
- css3 menu 手机菜单3
首先看一下效果图; 效果1,主要是 scale(0) -->scale(1px);opacity:0;—>opacity: 1; 然后递归延迟 怕麻烦也可以自己写个for循环 .five ...
- Android开发在路上：少去踩坑，多走捷径(转)
最近一朋友提了几个Android问题让我帮忙写个小分享,我觉得对新人还是挺有帮助的,所以有了这个小分享. 1. 目前, Android APP开发完成后,通常需要在哪些机型上进行测试? 2. 目前, ...
- 在.NET Fiddle有趣的沙盒代码
在.NET Fiddle有趣的沙盒代码 笔者:Tony Patton | 托尼·巴顿译:PurpleEndurer,2014-11-18,第1版 C#和VB.NET开发者能够使用.NET Fiddle ...
- 由于抽签HT For Web ComboBox下拉框组件
传统HTML5的下拉框select仅仅能实现简单的文字下拉列表,而HT for Web通用组件中ComboBox不仅可以实现传统HTML5下拉框效果,并且可以在文本框和下拉列表中加入自己定义的小图标, ...
- zzu--2014年11月16日月潭赛 C称号
1230: Magnets Time Limit: 1 Sec Memory Limit: 128 MB Submit: 24 Solved: 13 [id=1230" style=&q ...
- from声明
在整个应用程序,只有三行声明.这是最短单WIN32应用,但它的功能是非常有限,简单地显示一个消息框,示出来,其他什么事情也没有做.以下就来分析这三行语句了.别小看这三行语句.其实是隐藏着非常多知识点在 ...
- 第21章 策略模式（Strategy Pattern）
原文 第21章 策略模式(Strategy Pattern) 策略模式 导读:策略模式看完之后,大多数人都会感觉有点混了,包括我,感觉策略模式是一种OO思想的体现(纯属个人拙见). 概述: ...