首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用Vue.js在Janus上进行流

使用Vue.js在Janus上进行流
EN

Stack Overflow用户
提问于 2020-09-02 09:01:06
回答 1查看 1.3K关注 0票数 1

我在一台服务器上运行了Janus,它运行得很好,但是我很难找到在Janus服务器上流的方法,我在那里找不到任何代码片段,我正在使用Vue.js进行开发,是否有任何库可以在Janus上进行流呢?我只需要一个样本。

EN

回答 1

Stack Overflow用户

发布于 2021-02-02 15:34:57

Janus有一个流插件。您需要启用插件,并使用一些软件,如gstreamer或ffmpeg,以传输视频数据流插件。问答展示了如何在Raspberry Pi上这样做。https://superuser.com/questions/1458442/h264-stream-to-janus-using-ffmpeg-on-raspberry-pi

下面是简短的摘要。

设置Janus网关流插件

流插件配置文件是/opt/janus/etc/janus/janus.plugin.streaming.jcfg。(正式文件)

您可以发现有几个示例配置。例如,rtp-sample通过RTP接收VP8/Opus视频流数据。如果要流H.264视频,可以编辑配置以添加此设置。

代码语言:javascript
运行
复制
h264-sample: {
        type = "rtp"
        id = 10
        description = "H.264 live stream"
        audio = false
        video = true
        videoport = 8004
        videopt = 126
        videortpmap = "H264/90000"
        videofmtp = "profile-level-id=42e01f;packetization-mode=1"
        secret = "somesecretid"
}

编辑配置后,需要重新启动Janus网关。

启动视频流

您可以通过RTP向Janus流插件发送视频数据。例如,如果您有FFMpeg,您可以这样做。

代码语言:javascript
运行
复制
$ ffmpeg \
    -f v4l2 -thread_queue_size 8192 -input_format yuyv422 \
    -video_size 1280x720 -framerate 10 -i /dev/video0 \
    -c:v h264_omx -profile:v baseline -b:v 1M -bf 0 \
    -flags:v +global_header -bsf:v "dump_extra=freq=keyframe" \
    -max_delay 0 -an -bufsize 1M -vsync 1 -g 10 \
    -f rtp rtp://127.0.0.1:8004/

此命令从/dev/video0读取视频数据,请注意视频参数和输出RTP端口号(在上述示例中为8084)应该对应于配置。

准备Vue.js前端

下一步是前面。您可以创建web前端,使用捆绑在Janus中的janus.js查看流。正如在正式文件中所描述的,您可以使用janus.js作为JavaScript模块。但是,当您想从Vue.js中使用它时,您将需要出口装载机

例如,您可以创建Vue.js2项目并像这样添加janus.js。

代码语言:javascript
运行
复制
$ vue create mystreaming
$ cd mystreaming
$ yarn add git://github.com/meetecho/janus-gateway.git
$ yarn add exports-loader --dev

要添加Webpack配置,您需要创建具有以下内容的vue.config.js文件。

代码语言:javascript
运行
复制
const webpack = require('webpack')

module.exports = {
  configureWebpack: {
    plugins: [
      new webpack.ProvidePlugin({ adapter: 'webrtc-adapter' })
    ],
    module: {
      rules: [
        {
          test: require.resolve('janus-gateway'),
          loader: 'exports-loader',
          options: {
            exports: 'Janus',
          },
        }
      ]
    } 
  }
}

然后,您可以像这样从Janus模块导入Vue.js对象。

代码语言:javascript
运行
复制
import { Janus } from 'janus-gateway';

然后您可以使用janus.js并使用API接口接收流式视频数据。

我上传了示例Vue.js项目,这也可能对你有帮助。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63702171

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档