首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何保存实时视频流,并使用Websocket和Javascript MediaRecorder API将其转换为MediaRecorder?

如何保存实时视频流,并使用Websocket和Javascript MediaRecorder API将其转换为MediaRecorder?
EN

Stack Overflow用户
提问于 2019-02-14 06:50:32
回答 1查看 1.8K关注 0票数 0

我试图上传实时视频流使用Javascript和.NET网络套接字。我正在将Base64编码的数据每秒传递到webm服务器,在该服务器中,它将数据附加到一个文件中,该文件采用webm格式。有时,视频没有上传,原因是未知的错误,或者是部分上传。有人可以帮助最好的方法上传视频在服务器上的实时,并将其转换为MP4,而没有付费的第三方工具。我正在使用下面的代码-

代码语言:javascript
运行
复制
//js code

var handleDataAvailable = function(event) {
      if (event.data && event.data.size > 0) {
          try{          
                var reader = new window.FileReader();                  
                reader.onloadend = function () {
                  var base64data = reader.result;
                  if (ws.readyState == WebSocket.OPEN){
                    ws.send(base64data);
                  }
                }
                reader.readAsDataURL(event.data);            
          }catch(ex){

          }      
      }
    }
const SERVER_URL = "ws://localhost:5029";
var ws = new WebSocket(SERVER_URL);
var mediaRecorder = new MediaRecorder(outputStream, options);
mediaRecorder.ondataavailable = handleDataAvailable;

// C# code
// System.Net.WebSockets;
// websocket connection handling code
//

//on message event of websocket
public async Task OnMessage(string message)
{
    var base64Data = Regex.Match(message, @"data:video/(?<type>.+?),(?<data>.+)").Groups["data"].Value;
    var ByteArray = Convert.FromBase64String(base64Data);
    string path = "~//TempUploads//Recordings//test.webm";
    if (!Directory.Exists(HttpContext.Current.Server.MapPath(path)))
    {
        Directory.CreateDirectory(HttpContext.Current.Server.MapPath(path));
    }

    using (var stream = new FileStream(HttpContext.Current.Server.MapPath(path), FileMode.Append))
    {
      try
      {
        stream.Write(ByteArray, 0, ByteArray.Length);
      }
      catch (Exception ex)
      {


      }

    }

}
EN

回答 1

Stack Overflow用户

发布于 2020-04-26 10:08:10

对于在MediaRecorder API中遇到类似问题的人,请确保检查以下要点:

  • 实际上,您已经开始使用mediaRecorder.start()记录流
  • 尝试将数据发射时间增加到>= 1.5s,方法是将它作为一个参数传递给milisecs中的start()方法,例如:mediaRecorder.start(1500)。这一个给你的客户提供了更多的呼吸空间,在各块之间,减慢了你向后端发送数据的速度,但它增加了数据块的大小。
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/54684649

复制
相关文章

相似问题

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