javascript - Base64 value is not working with video tag? - Stack Overflow

admin管理员组

文章数量:1327524

i am adding src for video source with base64 value but its not working here is my html

<video id="video" controls> 
  <source type="video/mp4"  id="jh">  
</video> 

and my js is

$("#vd").click(function(){   
        $.ajax({
                url:"RetriveVedio",
                method: "get",
                dataType: 'text', 
                success:function(response){
                    console.log(response);

                     var src = 'data:video/mp4;base64,'+response;
                  $("#video").find("#jh").attr("src", src);
                // $('#video').load();
                 $("#video").trigger('load');
                 $("#video").trigger('play'); 
                }    
        });      
    });   

base64 value which is ing from server is AAAAGGZ0eXBtcDQyAAAAAG1wNDFpc29tBNjldm1kYXQAAAAAAAAAEAA= value is getting added to the source like this <source type="video/mp4" id="jh" src="data:video/mp4;base64,AAAAGGZ0eXBtcDQyAAAAAG1wNDFpc29tBNjldm1kYXQAAAAAAAAAEAA="> but video is not getting played. i am not able to trace it ,can any one help me?

isn't there any solution for it??

i am adding src for video source with base64 value but its not working here is my html

<video id="video" controls> 
  <source type="video/mp4"  id="jh">  
</video> 

and my js is

$("#vd").click(function(){   
        $.ajax({
                url:"RetriveVedio",
                method: "get",
                dataType: 'text', 
                success:function(response){
                    console.log(response);

                     var src = 'data:video/mp4;base64,'+response;
                  $("#video").find("#jh").attr("src", src);
                // $('#video').load();
                 $("#video").trigger('load');
                 $("#video").trigger('play'); 
                }    
        });      
    });   

base64 value which is ing from server is AAAAGGZ0eXBtcDQyAAAAAG1wNDFpc29tBNjldm1kYXQAAAAAAAAAEAA= value is getting added to the source like this <source type="video/mp4" id="jh" src="data:video/mp4;base64,AAAAGGZ0eXBtcDQyAAAAAG1wNDFpc29tBNjldm1kYXQAAAAAAAAAEAA="> but video is not getting played. i am not able to trace it ,can any one help me?

isn't there any solution for it??

• javascript
• jquery
• video

Share Improve this question Follow edited Sep 12, 2017 at 4:59 bharath asked Sep 11, 2017 at 9:37 bharathbharath 17533 gold badges55 silver badges1515 bronze badges 12

• Hmmm... Good question. I really dont know if base64 encoded src works with video. But I dont think so. – user6748331 Commented Sep 11, 2017 at 9:39
• ok but its working with images. – bharath Commented Sep 11, 2017 at 9:40
• It does work vith videos too iandevlin./html5/data-uri/video.php – Valdrinium Commented Sep 11, 2017 at 9:41
• 1 Wow. I did not know that. – user6748331 Commented Sep 11, 2017 at 9:43
• 1 Also, don't post duplicate questions : stackoverflow./questions/46168670/… Please delete of these, maybe the other one since it has got less attention. – Kaiido Commented Sep 12, 2017 at 5:57

 |  Show 7 more ments

3 Answers 3

Sorted by: Reset to default 5

I ran into this issue recently, my solution was to add the src attribute directly onto the <video> element. Like

<video src="-base64 string here-" width="xx" height="yy">
    Your browser does not support HTML5 video.
</video>

adding the src in the <source> element caused the video to do nothing.

"...But video is not getting played. i am not able to trace it, can any one help me?"

(1) Your string "AAAAGGZ0eXBtcDQyAAAAAG1wNDFpc29tBNjldm1kYXQAAAAAAAAAEAA=" only provides 41 bytes. This is not enough to play a video.

00 00 00 18 66 74 79 70 6D 70 34 32 00 00 00 00         ....ftypmp42....
6D 70 34 31 69 73 6F 6D 04 D8 E5 76 6D 64 61 74         mp41isom.Øåvmdat
00 00 00 00 00 00 00 10 00                              .........

(2) Your bytes begin with mdat (which is a/v data all mixed up in one group), the decoder needs moov part of file (which has metadata) to know where frame1 bytes begin/end within all that mixed mdat section. Best to make MP4 file with moov first, followed by mdat.

Find fixing tool online with keywords : fast start MP4 moov at front

(3) Because mdat is first, we can see its size at bytes : 04 D8 E5 76 (which means 81.3 MB). So you must receive around 81 megs before you even begin having metadata for decoder.

Decoder needs metadata (stored in moov section, after 81 megs of this mdat) before it can display anything or decode sound.

yes my response was not got encoded properly into the base64 value it was short and not valid one

本文标签： javascriptBase64 value is not working with video tagStack Overflow