如何在Uni-app中通过腾讯IM SDK实现社交应用和直播互动等功能
Uni-app想开发社交应用、IM、店铺客服、嵌入式社交模块、在线直播互动,这些功能Uni-app官方也没提供SDK,怎么办呢?找IM老大腾讯云啊,今天我们就在Uni-app中把腾讯云即时通讯TXIM SDK跑起来,实现发发消息,聊聊天等功能。废话不多说,开干!
1、插件的获取
1.1在线插件获取和运行请参考本站文章《Uni-app原生插件入门使用教程「1」:从Uni-app插件市场获取并试用插件》(文章地址),对应的插件地址:
智密-即时通讯TXIM(商业版)(试用就用商业版,省事)
智密-即时通讯TXIM(免费版)(链接里有免费试用的要求,当然要求也不高)
PS:免费版和收费版功能相同,都永久维护,收费版可以按照客户要求定制。当然目前功能足够丰富,可以说已经不需要定制了,我们把IM的接口基本都开放了,并且自己做了一套仿微信的IM(源码只提供给收费版客户,咱也要养开发人员不是),效果杠杠滴。
1.2离线插件获取和运行请参考本站文章:《Uni-app原生插件入门使用教程「2」:如何离线使用原生插件》(文章地址),对应插件地址:插件链接
试用的时候,建议试用在线的收费版插件(反正试用的时候免费的),为啥不用免费版呢... 因为免费版需要到我们网站注册才能获取到30天的免费试用,反而变得麻烦了;为啥不用离线包呢... 因为这不仅需要到我们网站注册,而且更关键的是超过40M的包去打包是要收费的,能白嫖的尽量白嫖吧...大家赚钱都不容易。
2、腾讯云中开通服务并获取相关参数(这里的每一步都要照做,后面要考...)
2.1 登录腾讯云,并找到“即时通讯IM”
首先麻烦您登陆腾讯云管理后台(跳转链接),(万一、如果、假设很幸运的你没有腾讯云账号,顺带你想用免费版,可以直接私信后台,也可以添加微信:zhimitec,获取我的推广信息之后再注册。天下没有免费的午餐,你免费的东西我得从你在腾讯云的消费中拿回来不是)登陆之后您将进入新版管理界面,旧版管理界面用户请自行切换至新版管理界面。进入之后,请在首页搜索框输入“即时通信 IM”,点击搜索结果进入 即时通信 IM应用总览。

2.2 创建应用
进入 即时通信 IM应用总览 之后,点击创建应用(如已有相关应用请跳过这一步)。

创建完成之后,我们需要点击已经创建的应用进入应用管理面板。

2.3 获取SDK_AppID(这里一会要考,看仔细喽...)
如图所示这是我们刚刚创建的“TXIM”应用对应的管理面板,我们需要记录 应用资料 - SDKAppID,稍后在uniapp项目中我们需要用到,如图所示,我们的SDKAppID是1400521882(请实际开发中使用您自己创建的应用对应的SDKAppID,请勿使用1400521882)

2.4 获取UserID和User Sign(这里一会要考,看仔细喽...)
测试时候生成的UserID + UserSign有效期为180天,需要通过腾讯云后台生成,在前面“准备环境”一文提到过的应用后台,具体操作如下。

请注意,用户名(UserID)使用数字/字母/数字+字母的组合,请勿使用中文,否则将导致登陆或发送消息时候抛异常无法正常使用。
2.5 官方SDK文档
因为我们的DEMO无法调用到所有的方法,但是我们在对接的时候尽量按照官方SDK的API进行了暴露,请多看官方SDK。
文档地址:链接
3、将DEMO中腾讯云部分参数更换为您自己的参数
3.1 替换SDK_AppID
请按照步骤2.3进行获取并完成替换。

3.2 替换UserID和User Sign
按照步骤2.4进行获取并完成替换,代码里面是10001用户登录,发送给10002,要看下获取到的数据的话,得换成10002登录,然后看数据回调就能看到10001发过来的数据啦。

4、运行DEMO
此DEMO只包含了单聊部分的接口,群聊部分的接口插件中也进行了集成,可以根据官方SDK的说明直接使用

5、付费版DEMO展示
当然了,做到付费版的DEMO样子,光一个IM插件是不够滴,拍照、拍摄视频、图片/视频选择这部分使用了相册插件,语音视频通话使用了腾讯的实时直播插件,消息推送使用了腾讯的TPNS,后续文章我们会先将用到的插件一个个分解讲述怎么把每个插件跑起来,最后再来写一个用Uniapp来实现微信的整个过程和关键代码(PS:源码目前来说我们只提供给IM付费客户,谁让IM的返点几乎木有呢)。



智密科技,专业开发各类Uniapp原生插件、目前交付给客户的插件已经超过100个各类插件,正在陆续整理上架并分享一切关于Uni-app的教程、资讯。欢迎加入QQ群与作者一起讨论uni-app!
插件使用交流QQ群:755910061
如何在Uni-app中通过腾讯IM SDK实现社交应用和直播互动等功能的更多相关文章
- 如需在APP中使用腾讯QQ登陆,需提前申请获取腾讯QQ的APPKEY和APPSecret。
如需在APP中使用腾讯QQ登陆,需提前申请获取腾讯QQ的APPKEY和APPSecret. 申请流程如下: 步骤1:登陆腾讯开放平台.链接地址: http://open.qq.com/ . 步骤2:填 ...
- uni app中使用自定义图标库
项目中难免会用到自定义图标,那在uni app中应该怎么使用呢? 首先, 将图标目录放在static资源目录下: 在main.js中引入就可以全局使用了 import '@/static/icon-o ...
- uni app中关于图片的分包加载
因为在项目中使用了大量的静态资源图片,使得主包体积过大, 而把这些图片全部放到服务器又有点麻烦,就想能不能把图片也分包,但是直接放在分包下的话导致图片资源找不到了, 在社区中看到大佬分享的十分有用,特 ...
- 怎样禁止手机app 中页面有时候会把数字当做电话号码,从而自动进行打电话功能
想要禁止这种功能,只需要给头不加一个meta标签就可以了, <meta name="format-detection" content="telephone=no& ...
- 如何把apk编译时间和最后次git commit的sha值,写入到app中
需求背景:我们修复Bug的时候,频繁提交APK包,导致测试同学搞不清哪个包才是最新的 比如一个版本3.0.1,我们可能后续基于这个版本陆续提交了好几个修复包 同时,如果服务端ip地址能在界面上配置的话 ...
- 如何在cocos2d项目中enable ARC
如何在cocos2d项目中enable ARC 基本思想就是不支持ARC的代码用和支持ARC的分开,通过xcode中设置编译选项,让支持和不支持ARC的代码共存. cocos2d是ios app开发中 ...
- 如何在NodeJS项目中优雅的使用ES6
如何在NodeJS项目中优雅的使用ES6 NodeJs最近的版本都开始支持ES6(ES2015)的新特性了,设置已经支持了async/await这样的更高级的特性.只是在使用的时候需要在node后面加 ...
- [译]如何在Web开发中使用Python
[译]如何在Web开发中使用Python 原文:HOWTO Use Python in the Web 摘要 这篇文档展示了Python如何融入到web中.它介绍了几种Python结合web服务器的方 ...
- 如何在Qt Creator中导入图标资源
本文主要描述如何在Qt Creator中创建资源文件,并的打入导入图标文件. 查看图标资源文件时,可以在项目的工程文件上鼠标单击右键-Open With-资源编辑器,效果如下图所示: 在项目的工程文件 ...
随机推荐
- ASP .Net Core 在 CentOS8 ARM 下连接 SQL Server 2008 R2(Hypervisor)
本文主要记录在 ARM 系统下无法连接SQL Server 2008 R2 的解决过程. 解决方案是使用 ODBC 的方式连接数据库,进行操作. 手上有公司的华为鲲鹏云计算 ARM 架构的 CentO ...
- 在Winform框架的多文档界面中实现双击子窗口单独弹出或拖出及拽回的处理
在基于DevExpress的多文档窗口界面中,我们一般使用XtraTabbedMdiManager来管理多文档窗口的一些特性,如顶部菜单,页面的关闭按钮处理,以及一些特殊的设置,本篇随笔介绍这些特点, ...
- GWAS数据分析常见的202个问题?
生信其实很简单,就是用别人的工具调参就行了.生信也很折腾,哪一步都可能遇到问题,随时让你疯掉(老辩证法了~).但是,你遇到的问题大部分人也都经历过.这时,检索技能就显得很重要了.平时Biostar和S ...
- 【数据库】本地NR数据库如何按物种拆分?
目录 1.准备本地数据库文件 1.1 NR库下载 1.2 Taxonomy数据库下载 2.按物种拆分NR库 2.1 第一步:获得Aceesson和分类物种的对应关系 2.2 第二步:获得分类物种的序列 ...
- R shinydashboard ——1. 基本用法
shiny和shinydashboard使用虽然简单,但控件众多,需及时总结归纳. install.packages("shinydashboard") shinydashboar ...
- R语言与医学统计图形【5】饼图、条件图
R语言基础绘图系统 基础图形--饼图.克利夫兰点图.条件图 6.饼图 pie(rep(1,26),col=rainbow(26), labels = LETTERS[1:26], #标签 radius ...
- 【宏蛋白组】iMetaLab平台分析肠道宏蛋白质组数据
目录 一.iMetaLab简介 二.内置工具与模块 1. Data Processing module 2. Functional Analysis 3. R Developing environme ...
- 巩固javaweb的第二十三天
巩固内容: 调用验证方法 验证通常在表单提交之前进行,可以通过按钮的 onClick 事件,也可以通过 form 表单 的 onSubmit 事件来完成. 本章实例是通过 form 表单的 onSub ...
- aboard, abolish
aboard board做动词有上车/船/飞机的意思,boarding就是正在上.board做名词有板的意思,车厢地板的板. a是个词根,有三种意思:1. 以某种状态或方式,如: ablaze, af ...
- Vue相关,Vue JSX
JSX简介 JSX是一种Javascript的语法扩展,JSX = Javascript + XML,即在Javascript里面写XML,因为JSX的这个特性,所以他即具备了Javascript的灵 ...