src에서 html5 비디오 태그를로드하는 방법 JavaScript에서?

Question

여기에 ASP.NET이 있습니다.이 특정 SignalR 라이브러리를 사용하여 내 클라이언트에 비디오를 브로드 캐스트합니다. 그러나 signalR이 메시징 시스템이므로 비디오를 스트리밍 할 수 없습니다. 비디오, 파일 또는 그런 것들을 스트리밍하기위한 것이 아닙니다.

이제 비디오를 Base64로 인코딩 된 버퍼로 비디오를 분할 한 다음 클라이언트에서 비디오 태그의 소스로로드하려고합니다. 여기

나는 클라이언트에서 일을하고 무엇을 보여

HTML 코드 :

<video id="myVideo"> 
    <source id="video_source"> 
</video> 

자바 스크립트 코드 : 음

//here somehow I am getting the string with the base64-encoded video 
function playVideo(message) { 
      var myVideo = document.getElementById("myVideo"); 
      var mySource = document.getElementById("video_source"); 
      mySource.setAttribute("src", getEncodedVideoString("mp4", message)); 
      myVideo.load(); 
      myVideo.play();   
     }; 

    // here I am formatting and concatenating the string for my source attribute 
    function getEncodedVideoString(type, message) { 
     return 'data:video/' + type + ';base64,' + message; 
    } 

당신이 순간에 볼 수 I 시나리오에 약간 이상하지만, 이미 클라이언트에 인코딩 된 비디오가 있습니다. 이제는 해당 비디오를 재생하는 방법을 찾아야합니다.

여기 내 질문이 떠오르면 이전에 이런 일을 한 사람이 있습니까? 아니면 그렇게 할 생각이나 제안이 있습니까?

Answer 1

흥미로운 질문에 고마워. 그것은 결코 전에 내 마음을 넘어서지 못했지만 가능할 것으로 보인다. 이안 데블린은 비디오를 포함하여 Data URIs with HTML5 media을 사용하는 방법에 대한 설명을 제공합니다. working example도 포함되어 있습니다.

유일한 차이점은 type 속성이 <source> 태그에 추가 된 것입니다. 이 코드를 추가해도 작동하지 않는다면 인코딩이 올바른지 확인하십시오. 시도 할 때 어떤 일이 일어나면 오류가 발생합니까?