此处有两大坑:

    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. JavaSE 初学系统托盘图标SystemTray类

    文章目录 1.预备知识 2.使系统托盘显示图标 3.添加提示 4.添加弹出菜单 设置Java程序的系统托盘图标,用到SystemTray类和TrayIcon类. 1.预备知识 JavaAPI对于Sys ...

  2. sublime text2 安装及使用教程

    1.下载安装包地址:https://www.sublimetext.com/2 2.安装,一直点下一步就好,将下列选项打钩,这样文件右键就可以直接用sublime text2打开 3.新建一个html ...

  3. python语法之正则

    1.正则表达式是用来干嘛的? 用来匹配字符串的  ,其中正则是意思是模糊匹配. 就其本质而言,正则表达式(或 RE)是一种小型的.高度专业化的编程语言,(在Python中)它内嵌在Python中,并通 ...

  4. IDEA中通过工具类实现对数据库的增删改查

    package com.hu.dao; import com.hu.entity.Student; import java.util.List;import java.util.Map; public ...

  5. 02.02.02 第2章 制作power bi图表(Power BI商业智能分析)

    ---恢复内容开始--- 02.02.02第2章 制作power bi图表 02.02.02.01 power pivot数据导入 00:08:43 02.02.02.02建立数据透视表 00:11: ...

  6. MacBook上那些好用的工具们

    https://blog.csdn.net/qq_33833327/article/details/78454703

  7. Redis的启动及配置

    在redis已经安装完成的情况下,进入redis/bin目录下,输入命令: ./redis-server,就可以直接启动redis了,效果如图所示: 但是此时终端无法进行任何操作,按CTRL+c命令, ...

  8. centos6安装oracle时运行./runInstaller无法弹出图形界面

    首先确保安装oracle的机器上安装了图形化界面. 1.利用xmanager登录到安装oracle的服务器上(直接用root用户登录) 2.运行 export DISPLAY=你的本机地址:0.0 3 ...

  9. uboot常用的函数

    http://blog.csdn.net/ooonebook/article/details/53206623 以下例子都以project X项目tiny210(s5pv210平台,armv7架构)为 ...

  10. java 幂等性(转)

    (转自)http://www.cnblogs.com/weidagang2046/archive/2011/06/04/idempotence.html 理解HTTP幂等性 基于HTTP协议的Web ...