欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识！
您现在的位置是： 首页

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

程序员文章站 2024-03-25 22:46:31
...

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

又快到一年一度的双十一了。淘宝直播一姐曾在去年双十一，一个人卖出了3.3亿的销售额，创造了行业的销售神话。近两年，很多电商平台开始关注起直播互动电商，希望在直播中，也可以增加互动，例如在直播过程中，抛出限量优惠商品，实时发送抢购的消息给观众。于是我们做了一个简单的Demo。

Demo大致的整体想法如下：以视频直播为主的互动模型基础上，结合语音转写功能进行设计，为主播摆脱Windows端繁琐操作，实现快速发题的功能。主播通过语音输入题目（问答题，答案只有是和否），确认后将题目文本发送给所有房间内的观众，观众收到题目后App主动弹框给观众选择结果。

1.1 功能拆解：

  • 只有主播有发布题目入口。
  • 需要ASR(Automatic Speech Recognition-语音识别)功能，有online实时翻译和本地offline翻译两个方案。
  • ASR结果需要主播确认。
  • ASR结果主播确认后需要通知给所有非主播用户。
  • 非主播用户收到题目信息时需要主动弹窗，给用户选择结果。

1.2 方案确定：

  • 为了确保ASR的准确性选择了online实时翻译，通过比对最终选择搜狗知音开放平台。
  • 题目信息也是文本类型，可以借用群聊实时消息通道，给题目信息前面加上特殊字符，非主播用户收到消息时判断是否是以特殊字符开始，如果是remove特殊字符并弹窗显示题目信息。特殊字符定义时可以考虑到扩展性，以后其它类似功能也可以通过该方案来实现。

2.1 视频直播DEMO

一个简单的视频直播Demo按以下几个步骤就可以实现了，可以找几个Android设备run一下看看效果，还是相当easy滴。

Step1 SDK集成

SDK还好支持maven依赖，在build.gradle的dependencies模块中加一行就行：

dependencies {
...
implementation 'io.agora.rtc:full-sdk:2.8.1'
}
复制代码

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

Step2 直播引擎创建

声网SDK有个重要的类RtcEngine，负责直播功能管理，提供了上/下线、状态监听、音/视频设置等比较丰富的Api，碰到问题时，首先查这个类就对了。创建引擎时APP_ID参数为声网开发平台创建的应用id。

private RtcEngine mRtcEngine;
try {
    mRtcEngine = RtcEngine.create(context, LiveDefine.APP_ID,
mRtcEventHandler);
    mRtcEngine.setChannelProfile(Constants.CHANNEL_PROFILE_COMMUNICATION);
    mRtcEngine.enableAudio(); // 开启音频功能
    mRtcEngine.enableVideo(); // 开启视频功能
} catch (Exception e) {
    e.printStackTrace();
}
复制代码

Step3 直播View关联

角色有主播和观众区分，关联View时有些许区别。ANCHOR_UID为主播用户id，主播端关联View时为自己的用户id，观众端关联view时为观看的主播的用户id。用户系统需要应用自己管理，声网SDK不提供用户管理。

SurfaceView surface = RtcEngine.CreateRendererView(this);
// 主播端View关联
mRtcEngine.setClientRole(Constants.CLIENT_ROLE_BROADCASTER);
mRtcEngine.enableLocalAudio(true); // 主播端需要打开本地音频
mRtcEngine.setupLocalVideo(new VideoCanvas(surface,
VideoCanvas.RENDER_MODE_HIDDEN, ANCHOR_UID)); // 主播端设置的是本地video
mRtcEngine.startPreview();  //主播需要开启视频预览
 
// 观众端View关联
mRtcEngine.setClientRole(Constants.CLIENT_ROLE_AUDIENCE);
mRtcEngine.enableLocalAudio(false); // 观众端不需要打开本地音频
mRtcEngine.setupRemoteVideo(new VideoCanvas(surface,
VideoCanvas.RENDER_MODE_HIDDEN, ANCHOR_UID)); // 观众端设置的是远端即主播video

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

Step4 加入房间

加入房间时第一个参数token为当前登录账户对应的token，应用自己管理，测试时可从传空。第二个参数为频道id，也是由应用自己管理的。第三个参数为频道名称。最后一个参数为当前登录的账户id

mRtcEngine.joinChannel("", CHANNEL_ID, "CHANNEL_NAME", uid);
复制代码

Step5 离开房间

// 主播端离开
mRtcEngine.setupLocalVideo(null);
mRtcEngine.stopPreview();
mRtcEngine.leaveChannel();
// 观众端离开
mRtcEngine.setupRemoteVideo(null);
mRtcEngine.leaveChannel();
复制代码

2.2 消息功能

直播房间消息功能可以说是相对基础而简单的了，我们选用的是声网实时信息SDK，这是一个独立的工具类SDK，声网将实时消息功能解耦出来，可以给各个场景提供消息支持。群聊实时消息可参考如下步骤：

Step1 依赖配置

dependencies {
...
implementation 'io.agora.rtm:rtm-sdk:1.0.1'
}
复制代码

Step2 消息引擎创建

// APP_ID同视频互动SDK保持一致即可
private RtmClient mRtmClient;
mRtmClient = RtmClient.createInstance(context, LiveDefine.APP_ID, listener);
复制代码

Step3 房间消息初始化

创建一个消息频道前需要调一次登录操作，第一个参数为应用账户token，第二个参数为账户标识。

mRtmClient.login("", userId,
new ResultCallback<Void>() {
    @Override
    public void onSuccess(Void aVoid) {
        Log.d(TAG, "rtmClient login success");
    }
    @Override
    public void onFailure(ErrorInfo errorInfo) {
        Log.d(TAG, "rtmClient login fail : " + errorInfo);
    }
});
复制代码

创建消息频道，CHANNEL_ID是一个标识，可以和直播频道不一致，但是建议保持一致：

RtmChannel mRtmChannel;
 
RtmChannelListener rtmListener = new RtmChannelListener(){
    @Override
    public void onMessageReceived(RtmMessage var1, RtmChannelMember var2){
        // 收到消息，自己发送的消息也会有该方法回调，可以通过RtmChannelMember判断发送消息的人是不是自己，如果是不处理本次消息即可。
    }
    
    @Override
    public void onMemberJoined(RtmChannelMember var1){
        // 有用户加入，可用来做用户上线消息处理
    }
 
    @Override
    public void onMemberLeft(RtmChannelMember var1){
          // 有用户离开，可用来做用户离线消息处理
    }
};
mRtmChannel = mRtmClient.createChannel(CHANNEL_ID,
rtmListener );;
复制代码

Step4 发送消息

RtmMessage rtmMessage = mRtmClient.createMessage();
rtmMessage.setText(msg);
mRtmChannel.sendMessage(rtmMessage, callback);

Step5 退出消息频道

可在退出直播房间时，调用该方法。

mRtmChannel.release();
复制代码

2.3 在线语音翻译

首先也是需要注册账户并创建应用，详见搜狗知音文档中心，实现可参考如下步骤：

Step1 初始化

调用init方法初始化

// 以下信息从知音平台申请获得
private static final String BASE_URL = "api.zhiyin.sogou.com";
private static final String APP_ID = "";
private static final String APP_KEY = "";
private SogoSpeech mSogouSpeech;
private DefaultAudioSource mAudioSource;
private OnSogouAsrListener mListener;
 
public void init(Context context) {
    ZhiyinInitInfo.Builder builder = new ZhiyinInitInfo.Builder();
    ZhiyinInitInfo initInfo = builder.setBaseUrl(BASE_URL).setUuid(UUID).setAppid(APP_ID).setAppkey(APP_KEY).create();
    SogoSpeech.initZhiyinInfo(context, initInfo);
 
    SogoSpeechSettings settings = SogoSpeechSettings.shareInstance();
    settings.setProperty(SpeechConstants.Parameter.ASR_ONLINE_AUDIO_CODING_INT,
1);
    settings.setProperty(SpeechConstants.Parameter.ASR_ONLINE_VAD_ENABLE_BOOLEAN,
false); 
    settings.setProperty(SpeechConstants.Parameter.ASR_ONLINE_VAD_LONGMODE_BOOLEAN,
true); // 长时间ASR
    settings.setProperty(Parameter.ASR_ONLINE_LANGUAGE_STRING,
ASRLanguageCode.CHINESE); // 也支持英文ASR ASRLanguageCode.ENGLIS
 
    mSogouSpeech = new SogoSpeech(context);
    mSogouSpeech.registerListener(mSpeechEventListener);
 
    mAudioSource = new DefaultAudioSource(new AudioRecordDataProviderFactory(context));
    mAudioSource.addAudioSourceListener(mAudioSourceListener);
}
 
private EventListener mSpeechEventListener = new EventListener() {
    @Override
    public void onEvent(String eventName, String param, byte[] data, int offset, int length, Object extra) {
        if (TextUtils.equals(SpeechConstants.Message.MSG_ASR_ONLINE_LAST_RESULT,
eventName)) {
            if (null != mListener) {
                mListener.onSogouAsrResult(param);
            }
            stopTransform();
        }
    }
 
    @Override
    public void onError(String errorDomain, int errorCode, String errorDescription, Object extra) {
        // 9002 用户主动取消
        if (9002 != errorCode && null != mListener) {
            mListener.onSogouAsrResult("");
        }
        stopTransform();
    }
};
 
private IAudioSourceListener mAudioSourceListener = new IAudioSourceListener() {
    @Override
    public void onBegin(IAudioSource iAudioSource) {
        Log.d(TAG, "AudioSource onBegin");
        mSogouSpeech.send(SpeechConstants.Command.ASR_ONLINE_START, "", null, 0, 0);
    }
 
    @Override
    public void onNewData(IAudioSource audioSource, Object dataArray, long packIndex, long sampleIndex, int flag) {
        final short[] data = (short[]) dataArray;
        mSogouSpeech.send(SpeechConstants.Command.ASR_ONLINE_RECOGIZE, "", data, (int) packIndex, 0);
    }
 
    @Override
    public void onEnd(IAudioSource audioSource, int status, Exception e, long sampleCount) {
        Log.d(TAG, "AudioSource onEnd");
        mSogouSpeech.send(SpeechConstants.Command.ASR_ONLINE_STOP, "", null, 0, 0);
    }
};
 
public interface OnSogouAsrListener {
    void onSogouAsrResult(String result);
}

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

Step2 开始语音识别

public void startTransform(OnSogouAsrListener listener) {
    mListener = listener;
    mSogouSpeech.send(SpeechConstants.Command.ASR_ONLINE_CREATE,
null, null, 0, 0);
    new Thread(mAudioSource, "audioRecordSource").start();
}
复制代码

Step3 停止语音识别

正常情况下不需要调用该方法，在EventListener 回调中已经调用过该方法了，为了确保状态正常也可以在退出房间时手动调用一次。

public void stopTransform() {
    mListener 
= null;
    if (null != mAudioSource) {
        mAudioSource.stop();
    }
}
复制代码

我们已经将这个 Demo上传至 Github，大家可以直接下载使用。
Android：github.com/AgoraIO-Com…
iOS:github.com/AgoraIO-Com…

最后秀一下Demo 实现的效果。
（1）主播端直播发题（语音转文字）：

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

 


（2）观众端答题

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

 

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？


（3）主播端收获答案

想做一个电商直播App跟上这波双十一，直播平台怎么搭建？

 

本文转载自网络，感谢（声网Agora）的分享，转载仅为分享干货知识，如有侵权欢迎联系云豹科技进行删除处理

相关标签： 直播源码 直播系统开发 直播平台开发

上一篇： 滑动平均滤波

下一篇： 海创软件组--vue使用jquery

推荐阅读