原生socket服务

步骤

新建一个文件夹
建立三个文件（依赖）

expressSocketSever.js
package-lock.json
package.json

3.打开编辑器终端，执行 npm i (或者yarn i ),前提是有包管理器npm或者yarn

客户端

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><input type="text" id="text"><button id="btn" type="button">发送</button><script type="text/javascript">const ws = new WebSocket('ws://localhost:8080')// ws.onopen = function (e) {//   ws.send('来自客户端的信息')// }// ws.onmessage = function (e) {//   console.log(e.data);// }ws.onopen = function () {document.getElementById('btn').onclick = function () {ws.send(document.getElementById('text').value);}}ws.onmessage = function (e) {// document.body.innerHTML += `<p>${e.data}</p>`let p = document.createElement('p')p.innerHTML = e.data;// appendChild() 方法可向节点的子节点列表的末尾添加新的子节点document.body.appendChild(p);}</script>
</body></html>

服务端

const ws = require('nodejs-websocket');const POST = 8080;//消息广播let connections = [];function broadcast(connections, msg) {connections.forEach(function(conn){conn.sendText(msg)})}const server = ws.createServer(connect => {connections.push(connect)connect.on("text", data => {console.log("received: "+data);connect.sendText(data);broadcast(connections,data)});connect.on("close", (code, reason) => {console.log("connection closed!");});connect.on('error', ()=>{console.log("connection error!");});});server.listen(POST, ()=>{console.log("websocket server start success!");});

服务地址为： ws://127.0.0.1:8080
端口号占用可以随意换

非原生，使用sockjs， http服务

建立步骤与原生相同，需要依赖，直接在前面建立的文件基础上新加

客户端

<!doctype html>
<html>
<head><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script src="http://cdn.jsdelivr.net/sockjs/1.0.1/sockjs.min.js"></script><style>.box {width: 300px;float: left;margin: 0 20px 0 20px;}.box div, .box input {border: 1px solid;-moz-border-radius: 4px;border-radius: 4px;width: 100%;padding: 0px;margin: 5px;}.box div {border-color: grey;height: 300px;overflow: auto;}.box input {height: 30px;}h1 {margin-left: 30px;}body {background-color: #F0F0F0;font-family: "Arial";}</style>
</head>
<body lang="en"><h1>Index</h1><div id="first" class="box"><div></div><form><input autocomplete="off" value="Type here..."></input></form></div><script>var sockjs_url = 'http://localhost:8080/echo';var sockjs = new SockJS(sockjs_url);$('#first input').focus();var div  = $('#first div');var inp  = $('#first input');var form = $('#first form');var print = function(m, p) {p = (p === undefined) ? '' : JSON.stringify(p);div.append($("<code>").text(m + ' ' + p));div.append($("<br>"));div.scrollTop(div.scrollTop()+10000);};sockjs.onopen    = function()  {print('[*] open', sockjs.protocol);};sockjs.onmessage = function(e) {print('[.] message', e.data);};sockjs.onclose   = function()  {print('[*] close');};form.submit(function() {print('[ ] sending', inp.val());sockjs.send(inp.val());inp.val('');return false;});</script>
</body>
</html>

服务端

var http = require('http');
var sockjs = require('sockjs');
var current = [];
var echo = sockjs.createServer();
echo.on('connection', function(conn) {current.push(conn)conn.on('data', function(message) {current.forEach((qq)=>  {// qq.write(JSON.stringify(message).replace(/\//g,''));qq.write(message);console.log(qq + conn + 'message')})});conn.on('close', function() {});
});var server = http.createServer();
echo.installHandlers(server, {prefix:'/echo'});
server.listen(8080);

完整文件夹目录：

其中server.js为原生服务端，使用node运行

服务地址为： ws://127.0.0.1:8080

其中sockjs.js为http服务，使用node运行

服务地址为： http://localhost:8080/echo

两个服务端建立连接之后，都会进行广播发送

附一个测试socket服务的地址：http://wstool.js.org/

nodej.s 搭建一个socket服务（原生和sockjs）相关推荐

搭建一个微服务商城到底可以有多快？
简介: 极速部署一个微服务电商商城,体验 Serverless 带给您的应用全托管体验. 作者:云原生技术运营 - 望宸技术实践的门槛不仅在于应用上线后各类问题的排查难度,也在于搭建一个 Demo ...
快速搭建一个网关服务，动态路由、鉴权看完就会（含流程图）
[文章来源]https://sourl.cn/tcbSPi 前言本文记录一下我是如何使用Gateway搭建网关服务及实现动态路由的,帮助大家学习如何快速搭建一个网关服务,了解路由相关配置,鉴权的流 ...
创建微服务架构的步骤_如何快速搭建一个微服务架构？
原标题:如何快速搭建一个微服务架构? 微服务火了很久,但网上很少有文章能做到成熟地将技术传播出来,同时完美地照顾"初入微服务领域人员",从 0 开始,采用通俗易懂的语言去讲解微服务 ...
快速正确的搭建一个微服务架构需要了解的那几个点
原文:https://my.oschina.net/u/3636867/blog/1803023 作者:烂猪皮一.微服务架构四大特性好的微服务架构是什么样的呢?想要搭建好一个微服务架构,必须要具备 ...
利用OpenStreetMap（OSM）数据搭建一个地图服务
图利用OSM数据简单发布的北京地图服务一.OSM是什么开放街道图(OpenStreetMap,简称OSM)是一个网上地图协作计划,目标是创造一个内容自由且能让所有人编辑的世界地图(wiki: ...
java造轮子：快速搭建一个网关服务，动态路由、鉴权看完就会（含流程图）
前言本文记录一下我是如何使用Gateway搭建网关服务及实现动态路由的,帮助大家学习如何快速搭建一个网关服务,了解路由相关配置,鉴权的流程及业务处理,有兴趣的一定看到最后,非常适合没接触过网关服务的 ...
【技术分享】Sanic+Amis：3天快速搭建一个web服务
前言测试工作中,需要搭建一些生产力小工具来提高工作效率. 基于web的服务,无需终端可多人协作,易部署,成为第一选择. 问题:搭建web服务需要全栈知识,编写http服务和前端样式需要一定技术门槛. ...
如何快速搭建一个微服务架构
何谓微服务架构的简单模式? 相对于大型互联网平台动辄几万并发的访问量,或者每天多次的在线版本发布,绝大多数企业和项目并没有这样的需求.他们关注的是如何更好地提高开发效率,如何更快地实现新需求,如何更便 ...
2022最新SpringCloud Alibaba入门到精通超详细版文档，教你从0到1搭建一个微服务项目
随着近年来互联网应用和需求爆发式的增长,快速迭代,高并发,高业务复杂度也是开发人员需要面临的难题.同时,服务器技术也迅速革新,微服务,云计算,容器管理,负载均衡,持续集成等技术的兴起,也改变了最初的开 ...

nodej.s 搭建一个socket服务（原生和sockjs）

原生socket服务

步骤

客户端

服务端

非原生，使用sockjs， http服务

客户端

服务端

nodej.s 搭建一个socket服务（原生和sockjs）相关推荐

最新文章

热门文章