zoukankan      html  css  js  c++  java
  • 推流,网页播放

    BiliBili有一个大神,开源了一套js,名字叫做flv.js

    中间尝试了很多东西,

    首先rtmp推流,然后需求是flv可以播放,然后要用nginx,所以下载了nginx for windows版本

    然后ffmpeg推流失败之后,因为需要支持flv的视频流,所以nginx需要一个模块名字叫做nginx-rtmp-module-master

    所以到github上找到相关代码发现,下载,编译,然后下载依赖项,下载mingw,下载mysys最后编译失败,因为mingw下不了

    然后用linux发现编译失败

    至此这条路失败。

    中间回想目的,客户端推流,服务端转发,然后再用浏览器播放,

    这里选择了nodejs然后加入了模块nodemediaserver。

    然后下载了obs studio中间下载了一个名字叫做OBS-Studio-22.0.2-Full-Installer-x64  version:22.0.2

    然后做推流,当然我换成了ffmpeg推流发现流的名字就是所谓的第二个参数

    然后下载flv.js,放到public目录

    根据功能,发现推流之后,转成flv的http在线,直接把地址写成:

    //url: 'http://localhost:8000/live/s.flv'

    这个是websocket写法其中live是路径,s是流的名称

    url: 'ws://localhost:8000/live/s.flv'

    ffmpeg的推流写法:rtmp://localhost:1938/live/s.flv 

    参考地址:https://github.com/illuspas/Node-Media-Server

    使用obs推流到node_media_server地址:

    https://www.jianshu.com/p/95c820473e9f

    ffmpeg命令:

    ffmpeg -list_devices true -f dshow -i dummy
    ffmpeg -f dshow -i video="screen-capture-recorder" -f dshow -i audio="virtual-audio-capturer" -pix_fmt yuv420p -vcodec libx264 -g 19 -s 1280x720 -r 15 -q 10 -ar 44100 -ac 2 -tune zerolatency -preset ultrafast -f flv "rtmp://localhost:1935/live/s"
    pause

    测试网页,放入node_media_server的public 目录

    <!DOCTYPE html>
    <html>
    <head>
       <meta charset="UTF-8">
       <title>直播</title>
    </head>
    <body>
       <script src="https://cdn.bootcss.com/flv.js/1.4.0/flv.min.js"></script>
       <video id="videoElement" width="100%" controls></video>
       <script>
           if (flvjs.isSupported()) {
               var videoElement = document.getElementById('videoElement');
               var flvPlayer = flvjs.createPlayer({
                    type: 'flv',
                    enableWorker: true, //浏览器端开启flv.js的worker,多进程运行flv.js
                    isLive: true, //直播模式
                    hasAudio: true, //关闭音频             
                    hasVideo: true,
                    stashInitialSize: 128,
                    enableStashBuffer: true, //播放flv时,设置是否启用播放缓存,只在直播起作用。
                    //url: 'http://localhost:8000/live/s.flv'
                    url: 'ws://localhost:8000/live/s.flv'
               });
               flvPlayer.attachMediaElement(videoElement);
               flvPlayer.load();
               flvPlayer.play();
           }
       </script>
    </body>

    nodejs代码:

    const { NodeMediaServer } = require('node-media-server');
    
    const config = {
      rtmp: {
        port: 1935,
        chunk_size: 60000,
        gop_cache: true,
        ping: 60,
        ping_timeout: 30
      },
      http: {
        port: 8000,
        allow_origin: '*'
      }
    };
    
    var nms = new NodeMediaServer(config);
    nms.run();
  • 相关阅读:
    LeetCode 1122. Relative Sort Array (数组的相对排序)
    LeetCode 46. Permutations (全排列)
    LeetCode 47. Permutations II (全排列 II)
    LeetCode 77. Combinations (组合)
    LeetCode 1005. Maximize Sum Of Array After K Negations (K 次取反后最大化的数组和)
    LeetCode 922. Sort Array By Parity II (按奇偶排序数组 II)
    LeetCode 1219. Path with Maximum Gold (黄金矿工)
    LeetCode 1029. Two City Scheduling (两地调度)
    LeetCode 392. Is Subsequence (判断子序列)
    写程序判断系统是大端序还是小端序
  • 原文地址:https://www.cnblogs.com/yang131/p/13338227.html
Copyright © 2011-2022 走看看