二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM

时间:2022-01-12 00:26:02

项目文章索引

1、项目引言

2、腾讯云后台配置TXIM

3、配置项目并实现IM登录

4、会话好友列表的实现

5、聊天输入框的实现

6、聊天界面容器的实现

7、聊天消息项的实现

8、聊天输入框扩展面板的实现

9、聊天会话管理的实现

10、聊天记录的加载与消息收发

11、定位SD配置与收发定位消息

12、贴图表情的定制化开发

13、腾讯云后台配置TRTC功能

14、集成音视频通话功能

15、集成仿微信的拍照,相册选择插件

16、集成美颜功能

17、集成TPNS消息推送(暂未接入)


@


文章概述

各位看官可能要失望了,都第二篇了居然还是一行代码都没看到,别急别急,记得磨刀不误砍柴工。

因为我们用到了腾讯云的SDK,所以我们在开发之前第一步就是要把腾讯云的AppId搞定,搞定AppId之后,还得去搞定用户信息,要不咋玩登录,往哪发消息啊。所以我们这一篇就是讲怎么配AppId和用户信息,下一篇我们就开始折腾代码了(PS:对自己自信的老哥可以直接去下载源码直接跑,这个写文章的人是菜鸟,大神在写代码)


一、配置腾讯云应用

首先请登录腾讯云管理后台,后台网址:https://console.cloud.tencent.com,登录之后请切换到新版管理界面,我们的截图是基于新版管理界面做的。

1.准备创建应用

腾讯的产品太多了,我们通过搜索“即时通讯 IM”,点击搜索结果进入“即时通讯 IM”应用总览界面

二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM

2.创建应用

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

二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM

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

二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM

3.获得需要的AppId

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

二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM

二、获取UserID与UserSign

AppId和密钥成功获取之后,我们要来创建登录时所需的用户账户信息。

1.测试时生成UserID + UserSign

测试时候生成的UserID + UserSign有效期为180天,需要通过腾讯云后台生成,在前面“准备环境”一文提到过的应用后台,具体操作如下。

二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM

请注意,用户名(UserID)使用数字/字母/数字+字母的组合,请勿使用中文,否则将导致登陆或发送消息时候抛异常无法正常使用。

2.发布时生成UserID + UserSign

发布时候生成UserID + UserSign需要后端支持(虽然可以客户端生成但是纯在安全情况故不建议),具体文章参考TXIM SDK官方文档(https://cloud.tencent.com/document/product/269/32688#.E6.9C.8D.E5.8A.A1.E7.AB.AF.E8.AE.A1.E7.AE.97-usersig

二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM

一般情况下我们时由用户输入账号密码,登陆后后端返回UserID + UserSig以登陆TXIM,此处有后端接入因此省略该环节,实际开发中开发者可根据实际情况选择合适的获取方式。

三、项目开源地址及交流群

项目开源地址:https://gitee.com/ckong/Zhimi.OpenSource.UniApp.TXIM.Vue

Uniapp开发交流群:755910061

二、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-腾讯云后台配置TXIM的更多相关文章

  1. 五、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-聊天输入框的实现

    会话好友列表的实现 1.项目引言 2.腾讯云后台配置TXIM 3.配置项目并实现IM登录 4.会话好友列表的实现 5.聊天输入框的实现 6.聊天界面容器的实现 7.聊天消息项的实现 8.聊天输入框扩展 ...

  2. 一、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-项目引言

    项目文章索引 1.项目引言 2.腾讯云后台配置TXIM 3.配置项目并实现IM登录 4.会话好友列表的实现 5.聊天输入框的实现 6.聊天界面容器的实现 7.聊天消息项的实现 8.聊天输入框扩展面板的 ...

  3. 三、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-配置项目并实现IM登录

    项目文章索引 1.项目引言 2.腾讯云后台配置TXIM 3.配置项目并实现IM登录 4.会话好友列表的实现 5.聊天输入框的实现 6.聊天界面容器的实现 7.聊天消息项的实现 8.聊天输入框扩展面板的 ...

  4. 四、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-会话好友列表的实现

    会话好友列表的实现 1.项目引言 2.腾讯云后台配置TXIM 3.配置项目并实现IM登录 4.会话好友列表的实现 5.聊天输入框的实现 6.聊天界面容器的实现 7.聊天消息项的实现 8.聊天输入框扩展 ...

  5. 七、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-聊天消息项的实现

    会话好友列表的实现 1.项目引言 2.腾讯云后台配置TXIM 3.配置项目并实现IM登录 4.会话好友列表的实现 5.聊天输入框的实现 6.聊天界面容器的实现 7.聊天消息项的实现 8.聊天输入框扩展 ...

  6. 八、Uniapp+vue+腾讯IM+腾讯音视频开发仿微信的IM聊天APP,支持各类消息收发,音视频通话,附vue实现源码(已开源)-聊天输入框扩展面板的实现

    聊天输入框扩展面板的实现 1.项目引言 2.腾讯云后台配置TXIM 3.配置项目并实现IM登录 4.会话好友列表的实现 5.聊天输入框的实现 6.聊天界面容器的实现 7.聊天消息项的实现 8.聊天输入 ...

  7. Android IOS WebRTC 音视频开发总结(六三)-- 2016国内IM云服务行业分析

    本文主要国内IM云服务行业分析,文章最早发表在我们的微信公众号上,详见这里,欢迎关注微信公众号blackerteam,更多详见www.blackerteam.com 谈到IM我们最先想到的是qq和微信 ...

  8. 框架源码系列七:Spring源码学习之BeanDefinition源码学习(BeanDefinition、Annotation 方式配置的BeanDefinition的解析)

    一.BeanDefinition 1. bean定义都定义了什么? 2.BeanDefinition的继承体系  父类: AttributeAccessor: 可以在xml的bean定义里面加上DTD ...

  9. Dubbo入门到精通学习笔记(十九):MySQL源码编译安装、MySQL主从复制的配置

    文章目录 MySQL 源码编译安装(CentOS-6.6+MySQL-5.6) 一.服务器配置: 二.源码安装 MySQL5.6.26: MySQL主从复制的配置 环境 依赖课程 MySQL 主从复制 ...

随机推荐

  1. sqlalchemy学习

    sqlalchemy官网API参考 原文作为一个Pythoner,不会SQLAlchemy都不好意思跟同行打招呼! #作者:笑虎 #链接:https://zhuanlan.zhihu.com/p/23 ...

  2. sharepoint2010问卷调查(4)-实现问卷的重复答复次数(采用自定义字段类型和JS)

    sharepoint的问卷调查可以设置重复和一次答复.但是设置一次后,调查过的用户再进行答复.会提示如下图: 分析下:该提示用户体验很不好.给用户感觉是系统出问题了.因此网上有人提出用eventhan ...

  3. 什么是领域驱动设计(Domain Driven Design)?

    本文是从 What is Domain Driven Design? 这篇文章翻译而来. ”…在很多领域,专家的作用体现在他们的专业知识上而不是智力上.“ -- Don Reinertsen 领域驱动 ...

  4. SharePoint开发 - 自定义页面(错误页、登出页)

    博客地址 http://blog.csdn.net/foxdave 本文叙述如何自定义SharePoint的固有页面,比较简单,用一句话说就是"做个页面,写一句代码." 创建Sha ...

  5. html添加keyword,description帮助百度收录处理方法,jsp去除空白行方法

    1.将网页的title,keyword,description写成include包含文件,例如: top.jsp <%@ page language="java" conte ...

  6. Pivot运算符用于在列和行之间

    本文导读:T-SQL语句中,Pivot运算符用于在列和行之间对数据进行旋转或透视转换,PIVOT命令可以实现数据表的列转行,同时执行聚合运算,UNPIVOT则与其相反,实现数据的行转列. PIVOT通 ...

  7. &period;Net程序员关于微信公众平台测试账户配置 项目总结

    今天项目第一次验收,夜晚吃过晚饭后,想把项目中用到的关于微信配置总结一下,虽然网上关于这方面的资料很多很多,还有官方API,但是总感觉缺点什么,就像期初做这个项目时,各方面找了很久的资料,说说配置吧! ...

  8. 全面解读Java NIO工作原理&lpar;1&rpar;

    全面解读Java NIO工作原理(1) 2011-12-14 10:31 Rollen Holt Rollen Holt的博客 我要评论(0) 字号:T | T JDK 1.4 中引入的新输入输出 ( ...

  9. InnoDB存储引擎结构介绍

    Ⅰ.InnoDB发展史 时间 事件 备注 1995 由Heikki Tuuri创建Innobase Oy公司,开发InnoDB存储引擎 Innobase开始做的是数据库,希望卖掉该公司 1996 My ...

  10. TCP端口检测工具

    很多时候,我们需要测试 tcp 端口.ping 命令虽然好用,但不能测试端口,因为 ping 基于ICMP协议,属于IP层协议,所以无法测试传输层的 TCP/UDP 端口.幸好有tcping命令,可以 ...