CODEWITHSUNDEEP
javascriptandroidgoogle-chromevideo
Fabrizio
Fabrizio

Reputation: 8043

Can't play a blob-url video using Chrome for Android

I'm facing an unusual issue while trying to record and play a video in Chrome for Android. (Same code works fine on Chrome for Desktop).

First of all, some informations:

My goal is that to record a video from tablet's camera and than play the recorded video. Here's an example code:

<!DOCTYPE html>
<html>
    <head>
        <title>Camera Test</title>
    <script type="text/javascript" src="//cdn.WebRTC-Experiment.com/RecordRTC.js"></script>
    </head>
    <body>

<script>


var cameraStream;
var cameraEl;
var cameraRecorder;
var cameraBlobURL;

window.URL = window.URL || window.webkitURL; 
navigator.getUserMedia = (  navigator.getUserMedia ||
                            navigator.webkitGetUserMedia ||
                            navigator.mozGetUserMedia ||
                            navigator.msGetUserMedia);



function askForCamera(){
    navigator.getUserMedia(
        { 
            video : true 
        },
        function(stream) {
            cameraStream = stream;
            cameraEl = document.getElementById("vidCamera");
            cameraEl.src = window.URL.createObjectURL(stream);  
        },
        function(){
            alert('fail camera');
        }
    );
}


function playCamera(){
    cameraEl.play();
}


function startRec(){
    cameraRecorder = RecordRTC(
                    cameraStream, 
                    {
                        type: 'video',
                        disableLogs : true
                    }
    );              
    cameraRecorder.startRecording();            
}

function stopRec(){
    cameraRecorder.stopRecording(function(blobURL){
        cameraBlobURL = blobURL;
        console.log(cameraBlobURL);
        alert(cameraRecorder.getBlob().type + '     ' +cameraRecorder.getBlob().size);

    });
}

function setBlob(){
    cameraEl.src = cameraBlobURL;   
}


</script>


<p>Buttons:</p>
<button type="button" onclick="askForCamera()">Ask for camera</button>
<button type="button" onclick="playCamera()">Play camera</button>
<button type="button" onclick="startRec()">Start Rec</button>
<button type="button" onclick="stopRec()">Stop Rec</button>

<button type="button" onclick="setBlob()">Set blob to camera</button>
<button type="button" onclick="playCamera()">Play camera</button>

<br/>
<p>Camera:</p>
<video id="vidCamera" width="200" height="200">
</video>



    </body>
</html>

How should I proceed in order to make sure it works on Chrome for Android? Hope someone can help me. Thanks to all!

Upvotes: 2

Views: 3803

Answers (1)

jrd261
jrd261

Reputation: 106

I've also run into this problem on Chrome 41 and believe its a bug. Possibly this issue:

https://code.google.com/p/chromium/issues/detail?id=253465

Upvotes: 4

Related Questions