用 Socket.D 替代原生 WebSocket 做前端开发
socket.d.js 是基于 websocket 包装的 socket.d 协议的实现。就是用 ws 传输数据,但功能更强大。
| 功能 | 原生 websocket | socket.d | 说明 |
|---|---|---|---|
| listen | 有 | 有 | 监听消息 |
| send | 有 | 有 | 发消息 |
| sendAndRequest | 无 | 有 | 发消息并接收一个响应(类似于 http) |
| sendAndSubscribe | 无 | 有 | 发消息并接收多个响应(也叫订阅) |
| event(or path) | 无 | 有 | 消息有事件或路径(可对消息,进行业务路由) |
| meta(or header) | 无 | 有 | 消息有元信息或头信息(可为数据,标注业务语义) |
| 自动心跳 | 无 | 有 | |
| 断开后自动重链 | 无 | 有 |
下面感受下开发方面的差异!
1、客户端示例代码
使用时,可以根据自己的业务对原生接口包装,进一步简化使用。
<script src="js/socket.d.js"></script>
<script>
async function init(){
//构建事件监听
const eventListener = await SocketD.newEventListener().doOnMessage((s,m)=>{
//监听所有消息(可能不需要)
}).doOn("/im/user.upline", (s,m)=>{ //事件的应用
//监听用户上线
let user_id = m.meta("user_id");
}).doOn("/im/user.downline", (s,m)=>{
//监听用户下线
let user_id = m.meta("user_id"); //元信息的应用
});
//创建单例
window.clientSession = SocketD.createClient("sd:ws://127.0.0.1:8602/?u=a&p=2")
.listen(eventListener)
.open();
}
function join(){
clientSession.sendAndRequest("/user/join", SocketD.newEntity()).thenReply(r->{
//加入成功
});
}
init();
</script>
Socket.D 有三个发消息的接口:
| 接口 | 说明 |
|---|---|
| send | 像 websocket。多了事件与元信息属性 |
| sendAndRequest | 像 http |
| sendAndSubscribe | 像 reactive stream 。多了事件与元信息属性 |
2、服务端示例代码(用 java 演示)
public class Demo {
public static void main(String[] args) throws Throwable {
List<Session> userSessions = new ArrayList<Session>();
//创建监听器
Listener listener = new EventListener().doOnOpen(s->{
//鉴权
if("a".equals(s.param("u")) == false){
s.close();
}else{
//加入用户表
s.attrPut("user_id", s.param("u"));
userSessions.add(s);
}
}).doOn("/user/join", (s,m)->{
if(m.isRequest()){
s.reply(m, new StringEntity());
}
for(Session s1: userSessions){
//告诉所有用户,有人上线
s1.send("/im/user.upline", new StringEntity().metaPut("user_id"), s.attr("userId"));
}
});
//启动服务
SocketD.createServer("sd:ws")
.config(c -> c.port(8602))
.listen(listener)
.start();
}
}
3、Socket.D 是什么东东?
Socket.D 是一个基于“事件”和“语义消息”“流”的网络应用层协议(听起来好像很 ao 口)。支持 tcp, udp, ws, kcp 传输(有各种不同语言的实现)。有用户说,“Socket.D 之于 Socket,尤如 Vue 之于 Js、Mvc 之于 Http”。
协议之所有强大,有三个关键基础因素:
- 事件
- 语义消息
- 流
它的帧码结构:
[len:int][flag:int][sid:str(<64)][\n][event:str(<512)][\n][metaString:str(<4k)][\n][data:byte(<16m)]
因为是应用层协议,所以可以建立在任意传输层协议之上。比如 websocket。
4、开源仓库
用 Socket.D 替代原生 WebSocket 做前端开发的更多相关文章
- 从cocos2d-html5中提取出来的,用做前端开发的框架——cc.js
从cocos2d-html5中提取出来的,用做前端开发的框架——cc.js /************************************************************* ...
- 利用 Grunt (几乎)无痛地做前端开发 (一)之单元测试
前言 如果你想开发一个js应用,甭管多简单,都要先创建整个宇宙 来看看我们的Javascript小宇宙: 确定如何根据需求.功能划分模块,如何将代码分成多个文件开发,合成一个发布 保证上一条的同时,使 ...
- 做一个会使用PS的前端开发
做前端开发的需不需要PS 记得在之前的老东家做某一个系统开发,当时正在做界面开发,发现界面还需要添加几个图标,于是把这个需求反馈给了项目经理.过了十几分钟,项目经理跑过来告诉我:产品部的UI设计人员( ...
- 在做APP前端开发时应注意的一些问题
在做APP前端开发时应注意的一些问题 在整个app开发流程中,app前端开发是一个必不可少的环节,也是一个在app开发过程中重量级的角色.说到这,那么在app应用的前端开发中,又要注意什么问题呢?一. ...
- web前端开发与iOS终端开发的异同[转]
* {-webkit-tap-highlight-color: rgba(0,0,0,0);}html {-webkit-text-size-adjust: none;}body {font-fami ...
- 作为一名前端开发工程师,你必须掌握的WEB模板引擎:Handlebars
作为一名前端开发工程师,你必须掌握的WEB模板引擎:Handlebars 一.为什么需要使用模板引擎? 关于为什么要使用模板引擎,按照我常对学生说的一句话就是:不用重复造轮子.. 简单来说,模板最 ...
- web前端开发必备技术
1.Vue.js是什么? Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注 ...
- Visual Studio前端开发工具/扩展
怎么样让Visual Studio更好地编写HTML5, CSS3, JavaScript, jQuery,换句话说就是如何更好地做前端开发.Visual Studio 2010不管是旗舰版还是免费版 ...
- openresty 前端开发进阶一之http后端
做前端开发,大多数情况下,都需要跟后端打交道,而最常见的方式则是通过http请求,进行通信. 在openresty中,通过http跟后端整合通信的方式又很多种,各有各的好处,可以根据情况交叉使用 1. ...
- 用 Docker 快速配置前端开发环境
来源于:http://dockone.io/article/1714 今天是你入职第一天. 你起了个大早,洗漱干净带着材料去入职. 签了合同,领了机器,坐到工位,泡一杯袋装红茶,按下开机键,输入密码, ...
随机推荐
- 【matplotlib 实战】--堆叠面积图
堆叠面积图和面积图都是用于展示数据随时间变化趋势的统计图表,但它们的特点有所不同.面积图的特点在于它能够直观地展示数量之间的关系,而且不需要标注数据点,可以轻松地观察数据的变化趋势.而堆叠面积图则更适 ...
- Django框架项目之支付功能——支付宝支付
文章目录 支付宝支付 入门 支付流程 aliapy二次封装包 GitHub开源框架 依赖 结构 alipay_public_key.pem app_private_key.pem setting.py ...
- WPF绘图(一):几何(Geometry)与形状(Shape)
1. Geometry 在数学中,我们可以用一个方程描述圆:x2+y2=25.这个方程描述的是,一个半径为5,中心点在(0,0)的圆.这种纯数学的描述就是Geometry(几何). 但此时,这个&qu ...
- nginx配置解决跨域访问
场景:前后的分离项目,前端vue框架,打包后放在Tomcat里访问,端口是8080,后端服务端口8058.访问前端项目时,调用后端接口报跨域. 后端环境 正常访问端口8058 经过nginx配置(文末 ...
- 2023-10-25:用go语言,假如某公司目前推出了N个在售的金融产品(1<=N<=100) 对于张三,用ai表示他购买了ai(0<=ai<=10^4)份额的第i个产品(1<=i<=N) 现给出K(
2023-10-25:用go语言,假如某公司目前推出了N个在售的金融产品(1<=N<=100) 对于张三,用ai表示他购买了ai(0<=ai<=10^4)份额的第i个产品(1& ...
- 自研、好用、够快、稳定、代码可读性强的ORM
Fast Framework 作者 Mr-zhong 代码改变世界.... 一.前言 Fast Framework 基于NET6.0 封装的轻量级 ORM 框架 支持多种数据库 SqlServer O ...
- 博弈论(Nim游戏 , 有向图游戏)
博弈论专题 Nim游戏 内容: 有 n 堆石子,每堆石子的石子数给出,甲乙两人回合制取石子,每次可以取任意一堆石子的任意多个(可以直接取完,但不能不取),每个人都按照最优策略来取(抽象),问先手必胜或 ...
- 创建CI/CD流水线中的IaC前,需要考虑哪些事项?
许多软件工程团队通常会遵循相似的方法来交付基础设施以支持软件开发生命周期.为了缩小基础设施配置方式与应用程序环境部署方式之间的差距,许多 DevOps 团队将其基础设施即代码(IaC)模块直接连接到其 ...
- cdq分治/整体二分
cdq分治: 使用场景: 三维偏序问题 优化dp 将动态问题转静态问题 99%题目能离线的情况下cdq可以替代树套树,时空都更优秀 整体二分: 起初用来解决动态区间第K min/max,在最基础的二分 ...
- HDL刷题:Edgedetect
原题链接 一道想了好久的题目,在这种并行执行的程序里怎么才能保存前一个状态,看了题解后才发觉,非阻塞赋值啊,代码如下: module top_module ( input clk, input [7: ...