OpenVidu测试环境安装部署【3】环境安装-Browser安装笔记

接上文：OpenVidu测试环境安装部署【2】环境安装-server安装笔记https://blog.csdn.net/anshichuxuezhe/article/details/110206249

OpenVidu分为两个部分：

• OpenVidu Browser：它是在客户端使用的库（可用于JavaScript和TypeScript）。它允许您创建视频呼叫，将用户加入其中，发送和接收视频和音频等。OpenVidu可用的所有操作均通过OpenVidu浏览器进行管理。
• OpenVidu Server：它是处理服务器端内容的应用程序。它从OpenVidu浏览器接收操作，并执行建立和管理视频通话所需的所有操作。您将无需显式使用它：只需运行它并知道其IP地址即可。

执行下方操作之前确保安装完成docker、并运行openvidu server镜像

Browser由两部分组成，这两个部分可以部署在不同服务器上：

· browser后台：它的主要作用是用来生成前台的token，token由于安全相关原因建议在后台生成

· browser前台：它的主要作用提供跟用户交互的界面，call版本实现了多人视频、多人语音、多人同屏、IM等功能

为了方便开发人员调试，所以将前后台分开部署，由于openvidu-call需要node环境，所以要保证服务器上先安装node

安装node（linux环境）

1、下载node，用淘宝的包，快

wget https://npm.taobao.org/mirrors/node/v14.15.1/node-v14.15.1-linux-x64.tar.gz

2、解压缩

tar -zvxf node-v14.15.1-linux-x64.tar.gz

3、添加软连接

ln -s /home/nodejs/node-v14.15.1-linux-x64/bin/* /usr/local/bin/

browser后台部署(linux，可以跟server在一台机器上)https://docs.openvidu.io/en/2.16.0/demos/openvidu-call/

1、下载前后台源码包，从Git上下载zip包或者是用命令下载，我是下载的zip包的方式

下载地址：https://github.com/OpenVidu/openvidu-call/archive/master.zip

2、解压文件，最终文件夹结构/home/openvidu/openvidu-call-master

cd /home/openvidu

unzip master.zip

3、打包项目

cd /home/openvidu/openvidu-call-master/openvidu-call-back/

npm install

npm run start

browser前台部署(window7)https://docs.openvidu.io/en/2.16.0/demos/openvidu-call/

安装node，win7支持到node-v12.1X，淘宝的包快

1、下载包https://npm.taobao.org/mirrors/node/v12.16.2/node-v12.16.2-win-x64.zip

2、配置环境变量，在系统变量中加

;D:\node-v12.16.2-win-x64\

接下来部署前台项目

1、下载源码包

下载地址：https://github.com/OpenVidu/openvidu-call/archive/master.zip

2、解压文件，最终文件夹结构D:\openvidu-call-master

3、打包项目

cd D:\openvidu-call-master\openvidu-call-front

npm install

4、安装ssl

参考Windows下Nginx配置SSL实现Https访问（包含openssl证书生成）https://blog.csdn.net/anshichuxuezhe/article/details/110069402

5、修改链接后台地址

进入D:\openvidu-call-master\openvidu-call-front\src目录修改proxy.conf.json文件

{
 "/": {
   "target": "http://192.168.123:5000",
   "secure": false
 }
}

6、启动项目

cd D:\openvidu-call-master\openvidu-call-front

npx ng serve --host 0.0.0.0 --ssl true --ssl-key D:\ssl\lee.key  --ssl-cert D:\ssl\lee.crt

 

安装完成，测试

打开浏览器访问

https://127.0.0.1:4200

出现交互界面说明部署成功。

7、生产打包命令

npx ng build --prod