For a long time i m trying to solve problem with cordova media plugin...
All i want is to play internet radio stream on button press (play)
This is my code:
app.js
var mmedia;
function playAudio(url) {
mmedia = new Media(url,
function () {
console.log("playAudio():Audio Success");
},
function (err) {
console.log("playAudio():Audio Error: " + err);
}
);
// Play audio
mmedia.play();
}
index.html
<input type="button" value="Play" onclick="playAudio('http://streaming.tdiradio.com:9000/');" />
But all i get is silence...And few hours later radio just starts playing..
Hours after app was closed (i didn't release media though)...
I'm using Android 4.4.2 on my phone..
On Ripple works just fine without 1s of delay..
What is this about? And what is the best way to solve this?
Related
I've got a problem with some code in Ionic.
I am developing an app on Ios and Android that needs access to the video.
The video is private and specific that is why I need to store them in the assets folder.
Here is the problem, sometimes on Android, the video can not be loaded from this file and I have a GET error, it tries 30 times to get the video and then stop.
That means that whenever I play the video I get an Error saying: Uncaught promise the play() method was interrupted by a call to pause().
Here are the request from the app
Error message
Above are the request and the error code.
Here is my HTML5 code :
<ion-row class="ion-justify-content-center ion-align-items-center">
<video class="ion-no-margin" #video *ngIf="exercise?.video"
playsinline loop preload="auto" [ngClass]="{'preview-video': !isExerciseStarted}"
tappable (click)="onClickStartVideo()" [poster]="exercise.thumbnail">
<source [src]="exercise?.video" type='video/mp4'>
</video>
</ion-row>
And here is the TypeScript :
public onClickStartVideo() {
const video = (<HTMLVideoElement>this.video.nativeElement);
if (this.isVideoPlaying) {
video.currentTime = 0;
} else {
video.currentTime = 0;
video.play();
}
this.isVideoPlaying = true;
}
Thank you for your help.
I'm using the following html code. I'm able to get a video stream on my desktop, but I'm getting a grey play button in the android webView app. I'm serving this over a https connection.
Please guide me as Im new to both of these code snippets.
HTML
<div id="video-container">
<video id="camera-stream" width="500" autoplay></video>
</div>
Script.js
window.onload = function() {
navigator.getUserMedia = (navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia);
if (navigator.getUserMedia) {
navigator.getUserMedia({ video: true },
function(localMediaStream) {
var vid = document.getElementById('camera-stream');
vid.srcObject = localMediaStream;
},
function(err) {
console.log('The following error occurred when trying to use getUserMedia: ' + err);
}
);
} else { alert('Sorry, your browser does not support getUserMedia'); }
}
This screenshot is taken from my desktop chrome browser.
and this is taken from my phone webView.
I know this is an old thread but I recently run into the same issue and only after a lot of tries I finally found the solution.
If you see this play button all the permission should be set correctly.
It seems that the webview is waiting for an user interaction to start the stream but tapping on the icon does not starts the video (idk how the user should "approve" the streaming)
The solution is to change the setting of the webview in you webapp:
webView.settings.mediaPlaybackRequiresUserGesture = false;
In this way the stream starts correctly without any user interaction
This question already has answers here:
Play sound on Phonegap app for Android
(6 answers)
Closed 8 years ago.
I'm creating an android web app and it's simple thing. I have a button and I want it to play a sound when clicked.
I'v searched a lot and actually no proper solution that could help me out.
I'm a newbie on this part and I really have no idea how I can play my sound.
any help will be appreciated.
Edited :
I installed media api on cordova :
var media = new Media(src, mediaSuccess, [mediaError], [mediaStatus]);
this is my html part :
<img src="images/applaud.png"></li>
this is the javascript part :
$("#applaud").bind('tap', function() {
var media = new Media("lib/sounds/hooray.mp3", mediaSuccess);
media.play();
});
BTW I'm using jQuery Mobile for this application. Should I do anything else.
Thanks to those who answered my questions.
Update :
I tried this code too ->
function playAudio(id) {
var audioElement = document.getElementById(id);
var url = audioElement.getAttribute('src');
var my_media = new Media(url,
// success callback
function () { alert("success"); },
// error callback
function (err) { alert("error"); }
);
// Play audio
my_media.play();
}
and then in my html it will be like this :
<img src="images/applaud.png">
still nothing, I even revert my cordova to version 3.1 but nothing
guys I really need help.
It sounds like you're developing an HTML web app. Try the HTML5 audio tag.
I have a weird issue playing videos embedded in video tags in my Phonegap 3.3 app on Samsung S4 + Android 4.4.2.
I have the following HTML code:
<video id='myvideo' autoplay=1 preload='auto'></video>
Videos are started via Javascript (with jQuery):
$('#myvideo').attr('src', 'http://...jpg');
$('#myvideo').attr('poster', 'http://...mp4');
$('#myvideo')[0].play();
Video does not start as expected.
The problem only turns out after upgrading from Android 4.2 to Android 4.4.2. The issue is not present on other smartphones running Android 4.4.2 (eg. Nexus 4, 5).
add this setting to your webview settings
webSettings.setMediaPlaybackRequiresUserGesture(false);
here is my js code to play video automatically and loop on it ( you can remove this part if you only want to play it once
// here is my code to find my video tag
var myVideo = document.getElementsByTagName('video')[0];
// if there is a video tag found ( this js is in a separate js files ) we play the video
if (typeof myVideo !== "undefined")
{
// setInterval allow me to monitor every 40 millisecond if the video is ending or not, if true we loop the video and play it again
setInterval(function() {
if ( myVideo.readyState != 0)
{
if (myVideo.paused) {
myVideo.currentTime = 0;
myVideo.play();
}
}
}, 40)
}
I think your .mp4 and .jpg are backwards.
I'm creating a smartphone app that is essentially a talking phrasebook, using App Framework 2 and Cordova 2.9, testing on a Samsung Galaxy S4. I found that after playing about 25 - 30 sound clips the sound stopped playing. I found the problem was that audio resources on Android are finite and not being released after issuing the media.play. I added a console log for each successful play and this showed successful execution even when it ran out of resources.
So, I added media.stop and media.release after the media.play (as discussed in several other questions on this forum and elsewhere) and found sound stopped working completely....sigh.
On a hunch, I added an alert statement between the media.play and media.stop and now sounds can be played as often as I want so long as I click OK when the alert displays. I also noticed the console log entries were no longer being made at all. So, it looks like the command after media.play is being executed immediately and not waiting for the sound to finish playing. Thus I issue media.play and before it can play the media.stop and media.release are executed and so I'm getting no sound. This seems to be confirmed as I noticed the alert was being displayed before the sound clip had finished playing and tapping OK terminated the sound playback, presumably because the media.stop and media.release were executed.
Am I misunderstanding how a synchronous call is supposed to work? Any suggestions to fix this much appreciated. Here's my js code:
<!-- Get the web root path -->
<script type="text/javascript">
function getWebRoot() {
"use strict" ;
var path = window.location.href ;
path = path.substring( 0, path.lastIndexOf( '/' ) ) ;
return path ;
}
</script>
<!-- /Get the web root path -->
<!-- Play sound using cordova -->
<script type="text/javascript">
function soundclip() {
var my_media = new Media(getWebRoot() + "/test.ogg", function() { console.log("my media found so stop and release after play"); });
my_media.play() ;
if (my_media) {
alert("my media found alert before stop and release") ;
my_media.stop();
my_media.release();
} ; // End If my_media
} ; // End soundclip
</script>
<!-- /Play sound using cordova -->
And here's the html
<input type="button" onClick="soundclip()" value=" Play Ay Caramba 1">
Thanks for any suggestions, this is driving me nuts !!