I am trying to allow users to capture and upload videos using ionic and firebase. After searching all over the web the overwhelming theme is, use MediaCapture. So I tried it. The thing I don’t understand is, if I record a video on my phone it is 1920x1080 and beautiful quality. When I capture video using MediaCapture, the video is 320x240 and absolutely horrid quality. I am setting the quality to 1 when calling captureVideo, but it doesn’t seem to matter, the video never gets above 320x240 and looks terrible. Here is the code I am using to get video…
this.mediaCap.captureVideo({limit: 1, duration: 60, quality: 1}).then((data: MediaFile[]) => {
let index = data[0].fullPath.lastIndexOf('/'), finalPath = data[0].fullPath.substr(0, index);
this.file.readAsArrayBuffer(finalPath, data[0].name).then((file) => {
let blob = new Blob([file], {type: data[0].type]});
let task = this.postRef.child(data[0].name]).put(blob);
task.on('state_changed', (snapshot) => {
console.log("upload is " + ((snapshot.bytesTransferred / snapshot.totalBytes) * 100) + "% done");
});
}).catch(err => { console.log(err); });
Which works great, the video gets uploaded, but like I said it’s 320x240 and terrible quality. I know it isn’t the uploaded file that is bad because I can see the video on my phone and it is tiny and terrible too. Is there any possible way to record good quality video? There’s no way I can release something where the best possible video quality is 320x240 and pixelated like it’s 1980. Any help would be greatly appreciated, I have scoured google and everyone says set quality to 1 or 0, 1 being high quality 0 being mms quality, but I am setting the quality to 1 and it is tiny and terrible. Please help. Thank you.
Android supports an additional quality property, to allow capturing video at different qualities. A value of 1 ( the default ) means high quality and value of 0 means low quality, suitable for MMS messages. See here for more details.
That is most of all the documentation I have been using, though I have found a few tutorials online and they all follow the same guidelines in these docs.
Yeah, I tried that one, and another one that actually saves it as an mp4 instead of 3gp. The weird thing is, I can get the video camera app up, and click on settings, but it is locked in at 320x240, it won’t let me change that option. However if I close my app out, then open my camera and go to the video camera, I can choose all the way up to FHD. Just for some reason when launching the camera with the mediaCapture it locks teh quality to 320x240
Okay, let’s try this real fast in your options remove the quality segment (the comma too);
then specify the size you want the camera to respect (pick something other than your 320x240).
Let me know what happens after that.
This will generate a default quality (it should at least) then use whichever
height/width you require in your functionality.
How can I specify the size though? The plugin only allows 3 options, limit (how many videos), duration (length of videos), and quality (pretty much useless as I have seen, lol). I would love to be able to specify the size, that would solve all of this. I will try it with the quality removed and see if that makes a difference at all.
The api is
MediaCapture.captureVideo(options).then(
where options are only limit, duration, and quality. There is nowhere to use the MediaFileData.
In the page you linked to it says,
Encapsulates format information about a media file.
Saying that it just gives you information about the file once it has been captured. If there is someway to use this to set the options I would be ecstatic, but I can’t find anywhere in the documentation that would provide a place to use this, other than to gather the information about the final video file.
It’s ok, I appreciate the help. This has been driving me insane and I just do not understand why it is stuck at such a low resolution. I have read other people talking about being worried they are getting the video at too high a resolution, but everything I have done forces the camera into 320x240 with no way to change it.
Thanks bro. I finally removed all of the options from the input completely and remove the “(data: MediaFile[])” from the .then function and just use “data => {” and it is allowing me to record with the better quality now. I wonder if there is some random bug where passing in the options is causing it to use low quality or something. I don’t know but it’s working now.
If you need any help with that, I am more than happy to help out. Part of the app I am building is a chat app with public and private channels, the private channels store all the messages, then load 100 when you load the page in, then scrolls to the bottom of the page. Just let me know. Thank you for your help
Lol.