阿里云体验--搭建超级小班课网课系统

搭建超级小班课网课系统

获取获取音视频通信应用AppKey
ECS
安装Node.js环境
修改配置
运行Demo
Demo源码解析

本文时按照阿里云入门实验步骤写出
使用ECS实例，搭建超级小班课的server和web服务。
使用RTC SDK，在多端快速实现音视频应用的胡同。
方案架构如下

获取获取音视频通信应用AppKey

使用您自己的阿里云账号登录到音视频通信RTC控制台。
应用管理➡查询AppKey➡确定
将AppId和AppKey复制保存下来，后续会用到

ECS

创建ECS
打开CMD，输入：ssh root@[ip地址]
输入yes 输入密码，进入终端

安装Node.js环境

执行以下命令下载Node.js二进制包。

wget https://nodejs.org/dist/v14.15.0/node-v14.15.0-linux-x64.tar.xz

执行以下命令将Node.js二进制包解压到路径/usr/local。

tar xf node-v14.15.0-linux-x64.tar.xz -C /usr/local/ --no-same-owner

执行以下命令将Node.js二进制文件所在路径加入到环境变量PATH中。

echo "export PATH=/usr/local/node-v14.15.0-linux-x64/bin:$PATH" >> /etc/profile

执行以下命令使修改的环境变量立即生效。

source /etc/profile

执行以下命令验证是否安装配置成功。

node -v

则为安装成功

修改配置

本场景中的ECS服务器/root路径中内置了超级小班课的项目源码和运行环境，在项目源码中填入自己的AppKey即可运行项目。

执行以下命令使用Vim打开config.js文件

 cd superclass_web/ && vim src/core/data/config.js

按下i键进入编辑模式，将appId和appKey修改为步骤二中查询到的AppId和AppKey。
保存并退出

运行Demo

执行以下命令安装项目依赖。

npm install

执行以下命令安装RTC SDK。

npm install aliyun-webrtc-sdk -S

执行以下命令运行项目。

npm run serve

运行成功之后，默认会在浏览器打开项目主页。如果没有自动打开，请在浏览器地址栏输入https://[ipaddress]:888

Demo源码解析

项目结构如下所示：
├── dist #打包文件
├── public #静态资源
├── src #项目文件目录
│ ├── assets #静态资源
│ ├── components #公共组件
│ ├── core #js文件
│ │ ├── data
│ │ │ ├── config.js #相关配置参数
│ │ ├── util
│ │ │ ├── utils.js #一些公共方法
│ │ ├── rtc-engine.js #单例
│ │ ├── rtc-clinet.js #RTC实例文件
│ ├── plugins
│ ├── router #路由
│ ├── views #页面
│ │ ├── login
│ │ │ ├── login.vue #登录页面
│ │ ├── student
│ │ │ ├── student.vue #学生页面
│ │ ├── assistant
│ │ │ ├── assistant.vue #助教页面
│ │ ├── teacher
│ │ │ ├── teacher.vue #教师页面
│ ├── vuex
│ ├── App.vue #根组件
│ ├── main.js #入口文件
├── vue.config.js #vue配置文件