websock(AMQ)通信-前端

levius 发布于2019-08-22 17:57 / 2951人阅读

摘要：服务端和客户端之间的通信前端开发经常会依赖后端，那么如果后端服务器还没做好推送服务器，那么前端该如何呢。可以通过客户端进行测试客户端代码见后面选取插件进行开发在命令台中输入以下命令这种方式更简单了。

服务端和客户端之间的通信

前端开发经常会依赖后端，那么如果后端服务器还没做好推送服务器，那么前端该如何呢。
最简单的就是自己模拟一个服务器，用node来搭建，这边只简单介绍搭建的过程

node搭建服务器

1.选取websocket插件进行开发

按照如下步骤进行开发
在命令台中输入以下命令

npm init -y 
npm i websocket -S

安装完websocket插件后就可以搭建服务器了，首先新建一个app.js，并且代码如下

var webSocketsServerPort = 3002
var webSocketServer = require("websocket").server
var http = require("http")

var server = http.createServer(function(req, res) {

})
server.listen(webSocketsServerPort, function() {
    console.log((new Date()) + "Server is listening on port " + webSocketsServerPort)
})

/**
 * websock server
 */
var wsServer = new webSocketServer({
    httpServer: server
})

wsServer.on("request", function(request) {
    var connection = request.accept(null, request.origin); 
    connection.on("message", function(message) {
        console.log("message");
    });

    connection.on("close", function(connection) {
        console.log("close");
    });

})

这样一个简易的服务器已经搭建完成。可以通过客户端进行测试(客户端代码见后面)

2.选取faye-websocket插件进行开发

在命令台中输入以下命令

npm init -y 
npm i faye-websocket-S

这种方式更简单了。代码如下

var WebSocket = require("faye-websocket"),
    http      = require("http");

var server = http.createServer();

server.on("upgrade", function(request, socket, body) {
  if (WebSocket.isWebSocket(request)) {
    var ws = new WebSocket(request, socket, body);

    ws.on("message", function(event) {
      ws.send(event.data);
    });

    ws.on("close", function(event) {
      console.log("close", event.code, event.reason);
      ws = null;
    });
  }
});

server.listen(3002);

3.选取socket.io插件进行开发

该插件依赖于express
命令如下

express -e node-js-socketio // express模板安装
npm i // 安装express插件
npm i socket.io -S // 安装socket.io

app.js文件改成如下代码

var app = require("express")()
  , server = require("http").createServer(app)
  , io = require("socket.io").listen(server);

server.listen(3002);

app.get("/", function (req, res) {
  res.sendfile(__dirname + "/client/index.html");
});

io.sockets.on("connection", function (socket) {
  socket.emit("news", { hello: "world" });
  socket.on("my other event", function (data) {
    console.log(data);
  });
});

至此服务器搭建已经完成(还有一种是基于stomp.js,目前还没弄清楚node如何搭建，等知道后在补充)

客户端（即浏览器）调用服务器

1.简单的demo如下

2.基于express的socket.io的demo如下

socket.io

Welcome to socket.io

3 基于AMQ的demo(目前还不知道服务器如何搭建，但客户端还是可以用的)

demo里放了3种模式，主要就是Queue和topic，消费和发布
Queue和topic的区别是一对多和多对多（QUEUE发送一个人消息之后，就消失了，而topic可以发送多个人）




    
    Document

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/95350.html

websock(AMQ)通信-前端

摘要：服务端和客户端之间的通信前端开发经常会依赖后端，那么如果后端服务器还没做好推送服务器，那么前端该如何呢。可以通过客户端进行测试客户端代码见后面选取插件进行开发在命令台中输入以下命令这种方式更简单了。服务端和客户端之间的通信前端开发经常会依赖后端，那么如果后端服务器还没做好推送服务器，那么前端该如何呢。最简单的就是自己模拟一个服务器，用node来搭建，这边只简单介绍搭建的过程 nod...

ARGUS 2019-08-02 10:40 评论0 收藏0
[译] RabbitMQ tutorials (3) ---- 'Pub/Sub'

摘要：生产者只能把消息发到交换器。是否要追加到一个特殊的队列是否要追加到许多的队列或者丢掉这条消息这些规则被定义为交换类型。有一点很关键，向不存在的交换器发布消息是被禁止的。如果仍然没有队列绑定交换器，消息会丢失。发布与订阅（Publish/Subscribe）在之前的章节中，我们创建了工作队列，之前的工作队列的假设是每个任务只被分发到一个worker。在这一节中，我们会做一些完全不一...

zzir 2019-08-21 15:08 评论0 收藏0
rabbitmq中文教程python版 - 发布 / 订阅

摘要：交易所在本教程的前几部分中，我们发送消息并从队列中接收消息。消费者是接收消息的用户的应用程序。中的消息传递模型的核心思想是生产者永远不会将任何消息直接发送到队列中。交换和队列之间的关系称为绑定。源码：https://github.com/ltoddy/rabbitmq-tutorial 发布 / 订阅 (using the Pika Python client) 本章节教程重点介绍的...

alphahans 2019-07-30 16:02 评论0 收藏0
WebSocket就这么回事儿

摘要：服务端确认协议版本，升级为协议。自己写了一个例子，服务端在开始连接后，利用定时器主动向客户端发送随机数，客户端也可以发给服务器消息，然后服务器返回这条消息给客户端。做的事情就是给页面的元素绑定事件。写在前面webSocket是一项可以让服务器将数据主动推送给客户端的技术。前几天写了一个日志功能，日志数据需要实时更新。正好项目中有封装好的WebSocket组件，且接口支持webSock...

ruicbAndroid 2019-08-26 10:57 评论0 收藏0
PHP 程序员也能做的 Java 开发 30分钟使用 netty 轻松打造一个高性能 websock

摘要：唯一的知识点就是的基础使用。可以简单的理解下面的代码就构建了一个服务器。握手完成之后的消息传递则在中处理。实际情况下，不可能那么多人同时说话广播，而是说话的人少，接受广播的人多。硬广一波 SF 官方首页推荐《PHP进阶之路》（你又多久没有投资自己了？先看后买）我们下面则将一些实际场景都添加进去，比如用户身份的验证，游客只能浏览不能发言，多房间（频道）的聊天。该博客非常适合 Java...

kviccn 2019-08-15 10:44 评论0 收藏0