Angular5集成eventbus的示例代码


Posted in Javascript onJuly 19, 2018

1.package.json中

"dependencies": {
   ...
  "vertx3-eventbus-client": "3.5.2",
 },

然后  npm install,或者:

npm install vertx3-eventbus-client@3.5.2

2.angular-cli.json中

"scripts": [
     ...
    "../node_modules/vertx3-eventbus-client/vertx-eventbus.js"
   ],

3.创建一个eventbus.service.ts用来通信

导入eventbus:

import { EventBus } from 'vertx3-eventbus-client';

声明eventbus:

declare var EventBus: any;

4.创建eventbus实例,监听接口以及发送消息

//创建实例
var eb = new EventBus('http://localhost:8080/eventbus');

eb.onopen = function() {
 //注册监听器用来接受消息
 eb.registerHandler('some-address', function(error, message) {
  console.log('received a message: ' + JSON.stringify(message));
 });

 //发送消息
 eb.send('some-address', {name: 'tim', age: 587});

}

更多信息请参考这里 https://vertx.io/docs/vertx-web/java/

注:

对于需要发送消息来接受的消息,需要先监听,然后再发送消息。
对于一直推送的消息,不需要发送。

代码实例如下:

RegisterHandler(key, id, callback) {
    const address = '***.' + key + '.' + id;
    if (typeof (this.eventBus[key]) === 'undefined' || !this.eventBus[key]) {
      this.eventBus[key] = new EventBus(environment.eventbusUrl);
    }
    if (this.eventBus[key].state === EventBus.OPEN) {
      this.eventBus[key].registerHandler(address, callback);
    } else {
      const $this = this;
      this.eventBus[key].onopen = function () {
        $this.eventBus[key].registerHandler(address, callback)
      }
    }
  }

Send(key, id) {
    var data = '';
    const address = ***.' + key + '.' + id;
    if (typeof (this.eventBus[key]) === 'undefined' || !this.eventBus[key]) {
      this.eventBus[key] = new EventBus(environment.eventbusUrl);
    }
    if (this.eventBus[key].state === EventBus.OPEN) {
      this.eventBus[key].send(address, data)
    } else {
      const $this = this;
      this.eventBus[key].onopen = function () {
        $this.eventBus[key].send(address, data)
      }
    }
  }

closeEventBus(key) {
    if (typeof (this.eventBus[key]) !== 'undefined' && this.eventBus[key] && this.eventBus[key].state === EventBus.OPEN) {
      this.eventBus[key].close();
    }
    this.eventBus[key] = null;
}

在组件ngOnDestroy中调用closeEventBus关闭eventbus。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 实现类的多种方法实例
May 01 Javascript
JQuery实现table行折叠效果以JSON做数据源
May 26 Javascript
如何用js 实现依赖注入的思想,后端框架思想搬到前端来
Aug 03 Javascript
实例解析JS布尔对象的toString()方法和valueOf()方法
Oct 25 Javascript
jQuery ajax应用总结
Jun 02 Javascript
Bootstrap中的Panel和Table全面解析
Jun 13 Javascript
js改变style样式和css样式的简单实例
Jun 28 Javascript
详解用函数式编程对JavaScript进行断舍离
Sep 18 Javascript
webpack4.0 入门实践教程
Oct 08 Javascript
vue模式history下在iis中配置流程
Apr 17 Javascript
layui问题之自动滚动二级iframe页面到指定位置的方法
Sep 18 Javascript
搭建vscode+vue环境的详细教程
Aug 31 Javascript
微信小程序实现弹出菜单
Jul 19 #Javascript
微信小程序实现之手势锁功能实例代码
Jul 19 #Javascript
React组件重构之嵌套+继承及高阶组件详解
Jul 19 #Javascript
微信小程序实现折叠展开效果
Jul 19 #Javascript
详解Angularjs 自定义指令中的数据绑定
Jul 19 #Javascript
微信小程序实现天气预报功能
Jul 18 #Javascript
vue代理和跨域问题的解决
Jul 18 #Javascript
You might like
分享PHP入门的学习方法
2007/01/02 PHP
php curl 登录163邮箱并抓取邮箱好友列表的代码(经测试)
2011/04/07 PHP
php利用ob_start()清除输出和选择性输出的方法
2018/01/18 PHP
php实现微信小程序授权登录功能(实现流程)
2019/11/13 PHP
自己的js工具_Form 封装
2009/08/21 Javascript
清空上传控件input file的值
2010/07/03 Javascript
jQuery中对节点进行操作的相关介绍
2013/04/16 Javascript
js实现单击图片放大图片的方法
2015/02/17 Javascript
jQuery事件绑定与解除绑定实现方法
2015/04/15 Javascript
jquery实现的仿天猫侧导航tab切换效果
2015/08/24 Javascript
浅谈javascript中onbeforeunload与onunload事件
2015/12/10 Javascript
jQuery模拟淘宝购物车功能
2017/02/27 Javascript
node.js中grunt和gulp的区别详解
2017/07/17 Javascript
Vue 2.0入门基础知识之内部指令详解
2017/10/15 Javascript
JavaScript ES6中的简写语法总结与使用技巧
2018/12/30 Javascript
VUE Elemen-ui之穿梭框使用方法详解
2021/01/19 Javascript
Python类的用法实例浅析
2015/05/27 Python
详解使用python crontab设置linux定时任务
2016/12/08 Python
python的pdb调试命令的命令整理及实例
2017/07/12 Python
Python温度转换实例分析
2018/01/17 Python
Python+tkinter使用40行代码实现计算器功能
2018/01/30 Python
Python定义一个跨越多行的字符串的多种方法小结
2018/07/19 Python
利用Python如何批量修改数据库执行Sql文件
2018/07/29 Python
python学习之hook钩子的原理和使用
2018/10/25 Python
Python字符串格式化输出代码实例
2019/11/22 Python
python的json中方法及jsonpath模块用法分析
2019/12/06 Python
Python GUI之tkinter窗口视窗教程大集合(推荐)
2020/10/20 Python
猫咪家具:CatsPlay
2018/11/03 全球购物
澳大利亚领先的女帽及配饰公司:Morgan&Taylor
2019/12/01 全球购物
党员对照检查材料思想汇报
2014/09/16 职场文书
汇报材料怎么写
2014/12/30 职场文书
工程部岗位职责范本
2015/04/11 职场文书
党员干部公开承诺书范文
2015/04/27 职场文书
售后服务质量承诺书
2015/04/29 职场文书
使用PDF.js渲染canvas实现预览pdf的效果示例
2021/04/17 Javascript
Spring Boot接口定义和全局异常统一处理
2022/04/20 Java/Android