此处有两大坑:

    1、下载easemob-websdk此npm包时,并没有下载strophe.js、crypto-js、underscore这三个包,需要自己手动下载。

    2、如下方标红位置所示,需要自己手动改动npm包内代码才可使用。

  

一、安装npm包

  1、npm install easemob-websdk --save

  2、npm install strophe.js --save

  3、npm install crypto-js --save

  4、npm install underscore --save

二、添加config.js文件

  在node_modules/easemob-websdk/src目录下创建config.js文件,向文件内添加如下内容:

var config = {
xmppURL: 'im-api.easemob.com', // xmpp Server地址,对于在console.easemob.com创建的appKey,固定为该值 apiURL: 'http://a1.easemob.com', // rest Server地址,对于在console.easemob.com创建的appkey,固定为该值 appkey: 'easemob-demo#chatdemoui', // App key https: false, // 是否使用https isMultiLoginSessions: false, // 是否开启多页面同步收消息,注意,需要先联系商务开通此功能 isAutoLogin: true, // 自动出席,(如设置为false,则表示离线,无法收消息,需要在登录成功后手动调用conn.setPresence()才可以收消息) isDebug: false, // 打开调试,会自动打印log,在控制台的console中查看log autoReconnectNumMax: , // 断线重连最大次数 autoReconnectInterval: , // 断线重连时间间隔 heartBeatWait: , // 使用webrtc(视频聊天)时发送心跳包的时间间隔,单位ms delivery: true, // 是否发送已读回执 } exports.config = config;

三、修改node_modules/easemob-websdk/src/connection.js文件:

  1、修改头部代码:

  

  2:找到WebIM声明处代码,添加如下代码:

  

四、修改node_modules/strophe.js/dist/strophe.js文件:

  

五、下面就可以在组件中使用:

  

angular整合环信webIM的更多相关文章

  1. vue-cli3.0 Typescript 项目集成环信WebIM 群组聊天

    项目背景 环信webim 官方没有vue版本的,自己就根据sdk重写了个vue版本的,只实现了基础的 登录 群组功能,其他的可以根据需要参考官方文档,添加相应的功能. 环信webim SDK相关文档: ...

  2. mui初级入门教程(五)— 聊聊即时通讯(IM),基于环信 web im SDK

    文章来源:小青年原创发布时间:2016-06-15关键词:mui,环信 web im,html5+,im,页面传值,缓存转载需标注本文原始地址: http://zhaomenghuan.github. ...

  3. 基于vue的环信基本实时通信功能

    本篇文章借鉴了一些资料,然后在这个基础上,我将环信的实现全部都集成在一个组件里面进行实现: https://blog.csdn.net/github_35631540/article/details/ ...

  4. Vue 集成环信 全局封装环信WebSDK 可直接使用

    2019-11-25更新 npm install --save easemob-websdk请直接使用官方安装方式即可.import WebIM from 'easemob-websdk' 以下是最开 ...

  5. 基于环信SDK的IM即时通讯填坑之路(vue)

    公司最近使用第三方环信SDK的进行通信聊天,基本已完成.记录下填坑之路 1.可以通过以下方式引用 WebSDK 1.安装 npm install easemob-websdk --save 2. 先 ...

  6. iOS-即时通讯-环信

    下载地址:http://www.easemob.com/downloads SDK目录讲解 1.从官网下载下来的包分为如下四部分: 环信iOS SDK 开发使用 环信iOS release note ...

  7. 环信Restfull API dotnetSDK

    Easemob.Restfull4Net 环信Restfull API dotnet的封装 支持的.Net Framework版本:4.0 API地址:http://docs.easemob.com/ ...

  8. 环信SDK集成

    利用环信SDK可以实现即时通讯,但在集成的过程中碰到了不少的坑. 注意 选择项目路径,这里以最新版环信demo为例 注意:环信的ChatDemoUI这个demo里边因为研发的同事为了照顾老版本的And ...

  9. 集成IOS 环信SDK

    集成IOS SDK 在您阅读此文档时,我们假定您已经具备了基础的 iOS 应用开发经验,并能够理解相关基础概念. 下载SDK 通过Cocoapods下载地址 不包含实时语音版本SDK(EaseMobC ...

随机推荐

  1. GUI学习之七——单选框QRadioButton和QButtonGroup的学习总结

    一.单选框QRadioButton的使用 1.类的描述 a.单选框按钮用于给用户提供若干选项中的单选操作,当一个被选中时,会自动取消选中的那个.(如果只有一个时可以通过单击该按钮改变其状态:而存在多个 ...

  2. Google关于Spanner的论文中分布式事务的实现

    Google关于Spanner的论文中分布式事务的实现 Google在Spanner相关的论文中详细的解释了Percolator分布式事务的实现方式, 而且用简洁的伪代码示例怎么实现分布式事务; Pe ...

  3. Java和C++的数组比较

    Java:数组的定义:如下两种方式都可以:int array[];int[] array; 注意:数组在定义后,不能直接使用.必须在初始化后才能使用.初始化有两种方式:1.静态初始化:int arra ...

  4. RNQOJ 21 FBI数

    如果字符串全是0输出B,全是1输出I,01混合输出F,如果字符串分解到只剩下一个字符的时候我们可以很简单的判断出来是B串还是I串,如果处在父节点的位置,这里运用递归,通过子节点的返回值来判断子节点是混 ...

  5. Maven学习 七 Maven项目创建(2)war项目

    一.web项目的目录结构 如果手动创建一个java  web项目,其基本的目录结构包括:METE-INF,WEB-INF,以及WEB-INF下必须包含一个web.xml文件 二.使用Maven创建wa ...

  6. 前端页面播放 rtmp 流与 flv 格式视频文件

    技术 :angular/cli , html5 , typescript , scss ,es 6 ... 项目类型:直播视频与视频回放 使用到 插件 : videojs + ckplayer 遇到的 ...

  7. 高速上手C++11 14 笔记2

    lambda表达式和std function bind 两者配合构成了函数新的使用方法. 智能指针 sharedptr, uniqueptr, weak_ptr auto pointer = std: ...

  8. final,finally,finalize

    final:可以修饰属性,可以修饰方法(方法不能被重写,可以继承),可以修饰类(该类不能被继承,不能产生子类) finally:无论什么情况,都会执行 finalize:垃圾回收时,调用此方法

  9. var let const的区别

    1. 变量提升: 浏览器在运行代码之前会进行预解析,不论var声明的变量处于当前作用域的第几行,都会提升到作用域的头部.   2. 只要块级作用域内存在let命令,它所声明的变量就“绑定”这个区域,不 ...

  10. asp.net 抽象方法和虚方法的用法区别,用Global类重写Application_BeginRequest等方法为例子

    不废话,直接贴代码 public abstract class LogNetGlobal : System.Web.HttpApplication { protected void Applicati ...