目录
介绍
声网介绍
使用前提
实现代码方案
介绍
此文章仅实现简单代码案列，一切从简！
在手机游戏中无处不见的组队沟通功能，那么这是如何实现的呢？当然使用纯前端是无法实现此功能底层代码的，但是可以通过三方开源SDK来实现，这里指的就是 声网 Web SDK。
声网介绍
声网 SDK，支持对语音对其接入使用，Java Android Web IOS python 等皆可接入，此文章仅介绍纯语音功能，当然还可以实现音视频直播等其他功能。
在使用前需要注意点，在本地服务器（localhost）运行 Web 应用仅作为测试用途因此非HTTPS同样可以正常访问，但是在生产环境必须为 HTTPS 协议，再者声网对不安全协议域名做了限制，列入：Cpolar 部署时选择的随机域名等。
使用前提
1. 注册并登录
地址：Agora.io Signup
注册和登录过程中如果遇到疑问
注册与登录 - 声网平台 - 文档中心 - 声网Agora更换邮箱
https://docportal.shengwang.cn/cn/Agora%20Platform/sign_in_and_sign_up?platform=All%20Platforms
2. 创建项目
登录进入首页左上角下拉框点击后出现选项，然后选择创建项。
如下图，项目名称自定义。
实现代码方案
在以上准备工作已就绪时，就可在项目中使用，此处拿 Vue 举例引入并使用。
1. 依赖或SDK文件
Vue 中使用 npm install agora-rtc-sdk-ng 下载依赖
2.组件导入并调用API
HTML 代码
<template> <div> <button @click="join" type="button">JOIN</button> <button @click="leave" type="button">LEAVE</button> </div></template>JS 代码
在加入频道前，需要确认电脑或手机是否拥有音频设备（耳机），并且 uId 用户标识时唯一的且必须为数字。
import AgoraRTC from "agora-rtc-sdk-ng";let rtc = { client: null, localAudioTrack: null,};let options = { // 用户标识 uid: 0, // 权限验证 token: "", // 声网为开发项目生成的字符串,是项目的唯一标识 appId:"", // 频道名称 channel: "agoraRtcDemo", }const created = () => { 创建 AgoraRTCClient 对象, 并设置编码格式 rtc.client = AgoraRTC.createClient({mode: "rtc", codec: "vp8"}); // 监听远端用户将本地音轨发送至RTC频道 rtc.client.on("user-published", async (user, mediaType) => { // 订阅远端用户 await rtc.client.subscribe(user, mediaType); if (mediaType === "audio") { // 获取远端本地音轨并播放 const remoteAudioTrack = user.audioTrack; remoteAudioTrack.play(); } });}const join = async () => { // 用户加入频道 await rtc.client.join(options.appId, options.channel, options.token, uid.value); // 本地音轨 rtc.localAudioTrack = await AgoraRTC.createMicrophoneAudioTrack(); // 将本地音轨发送至 RTC 频道 await rtc.client.publish([rtc.localAudioTrack]);}const leave = async () => { // 关闭本地音轨 rtc.localAudioTrack.close(); // 退出 RTC 频道 await rtc.client.leave();}通过以上步骤即可实现组队语音沟通，交互样式就不花费时间编写了，自行根据业务场景进行开发，此步声网SDK语音沟通功能就实现了，当然要可以设置语音的各种API 如音量调整等官网自行查阅。