Ionic 2 streaming media plugin not working on iOS - ios

I created a live streaming app, i used the streaming media plugin for playing the videos and it works well on android but it doesn't work on iOS.
The video player open successfully but the video not working and no errors appear in the console.
Link of the plugin
playVideo(url) {
let options: StreamingVideoOptions = {
successCallback: () => { console.log('Finished Video') },
errorCallback: (e) => { console.log('Error: ', e) },
orientation: 'portrait'
};
this.streamingMedia.playVideo(url, options);
}

Use IONIC InAppBrowser instead of StreamingVideoOptions
InAppBrowser Docs
-https://ionicframework.com/docs/native/in-app-browser/
Use this code for ios
const browser = this.iab.create(url, '_self');
browser.show;
Use this code for android
streamingMedia.playVideo(url, options);

Related

How to access camera and earphones in ios in PWA (React)

I am new to the react js. Here I am trying to access the mobile camera in the app. Here,
I am trying to use the getUserMedia .
I am able to access the camera in the android device. But not able to access in the IOS.
So, I am using react for this.
if (!('getUserMedia' in navigator.mediaDevices)) {
navigator.mediaDevices.getUserMedia = function (constraints) {
var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia;
if (!getUserMedia) {
return Promise.reject(new Error('getUserMedia is not implemented!'));
}
return new Promise(function (resolve, reject) {
getUserMedia.call(navigator, constraints, resolve, reject);
});
}
}
navigator.mediaDevices.getUserMedia({
video: { facingMode: 'user', width: 1200, height: 600 },
audio: true
}).then((stream) => {
console.log('recording started');
this.setState({
cameraAccessGranted: true,
});
return this.startRecording(stream)
}).
Can any one please help me with this ?
Thanks in advance .
It doesn't matter if it is React or not, WebRtc is not dependent on framework.
Have you tried to check examples from https://webrtc.github.io/samples/src/content/devices/input-output/ on your android?
For me it works well

Apache Cordova listens event too late on ios after action

I develop iOS app with Apache Cordova on Xcode. The problem is when I test my app on device, Cordova listens events too late. For example, when I click share button on iOS, the share box runs after 2 minutes. Another example is I use admob pro pluginfor admob, the ads run after 5 minutes on device ready. I recognized that this problem is exist only on Cordova and its plugins events.
I checked and tried everything but couldn't find a solution. On android platform everything is work fine.
How can I fix this? Is there anybody can help me ?
the admob responding after 2-5 minutes. I did type simple javascript function that is alert for device ready. its working fine.
the code snippet is below;
function reklamYukle() {
var admobid = {};
// TODO: replace the following ad units with your own
if (/(android)/i.test(navigator.userAgent)) {
admobid = { // for Android
banner: 'ca-app-pub-5534669392136777/3711456161',
interstitial: 'ca-app-pub-5534669392134577/5454702358'
};
} else if (/(ipod|iphone|ipad)/i.test(navigator.userAgent)) {
admobid = { // for iOS
banner: 'ca-app-pub-5534669392136777/7457497261',
interstitial: 'ca-app-pub-5534669392136777/5896501200'
};
} else {
admobid = { // for Windows Phone
banner: 'ca-app-pub-6869992474017983/8878394753'
};
}
AdMob.createBanner({
adId: admobid.banner,
position: AdMob.AD_POSITION.BOTTOM_CENTER,
overlap: false,
offsetTopBar: true,
bgColor: 'black',
autoshow: true
});
AdMob.prepareInterstitial({
adId: admobid.interstitial,
autoShow: true
});
}
function onDeviceReady() {
reklamYukle();
}
document.addEventListener("deviceready", onDeviceReady, false);

iOS 9 can’t play audio/video files that are downloaded to device

Has anyone else had this issue?
When I use the cordova media plugin in order to play an mp3 file on iOS, I get no error or response as to why it's not working.
I've gotten the ngCordova media plugin to work in my app on my ios emulator, using an external URL to play the audio file...however, I'm trying to build some functionality where basically you download the mp3 from an external source, save it to your device, and then play the file from there. I can't seem to get it work, even though I can verify that the file does exist. Here is my code for the function:
$scope.playAudio = function() {
document.addEventListener('deviceready', function () {
var src = cordova.file.dataDirectory + fileSrc;
var media = $cordovaMedia.newMedia(src);
var iOSPlayOptions = {
numberOfLoops: 1,
playAudioWhenScreenIsLocked : true
};
media.play(iOSPlayOptions); // iOS only!
media.play(); // Android
});
}
I should note that this functionality DOES work on my android device, but on both my ios simulator AND real device, it does absolutely nothing.
I should note that I'm using iOS 9 and xCode 7.1
Has anyone else had any issues with trying to play an audio or video file from their local device, in their app?
So it looks like I was able to solve the problem by resolving the local filepath to an internal URL using the $window.resolveLocalFileSystemURL() and src.toInternalURL() functions
$scope.playAudio = function() {
document.addEventListener('deviceready', function () {
var src = cordova.file.dataDirectory + fileSrc;
$window.resolveLocalFileSystemURL(src, function(dir){
basePath = dir.toInternalURL();
media = $cordovaMedia.newMedia(basePath);
var iOSPlayOptions = {
numberOfLoops: 1,
playAudioWhenScreenIsLocked : true
};
$scope.data.playing = true;
media.play(iOSPlayOptions); // iOS only!
//media.play(); // Android
})
});
}

Jplayer is not working with mobile Browser (IPAD)

HI All,
I am working with Jplayer on IPAD, and I have implemented the Jplayer plugin and it is working with all browser with But with IPAD it is showing below error message.
"Error Hint:- Check media URl is valid
Context:- Media URl could not be loaded"
Could anyone help me code snippet is given below. (I have tested with 2.4 also the same error is persisting there as well).
Below is the function inisiatating Jpalyer
startAudio: function() {
var _this = this;
_this.initJPlayerHandlers();
var solution_type = "flash, html";
if($.browser.msie && parseInt($.browser.version, 10) > 8) {
solution_type = "html, flash";
}
_this.jplayer_el.jPlayer({
ready: function() {
$(this).jPlayer(
"setMedia", {
mp3: "/wd/mca.mp3?BID=" + MCA.singletons.self.bid
}).jPlayer("play");
},
supplied: "mp3",
swfPath: "js",
solution: solution_type,
preload: "none"
});
},
I am using IPAD4 having IOS 7 and IPad mini with IOS7.This issue is coming up only with IPAD4.
Autoplay is not supported on iOS and Andriod
JQuery jPlayer autoplay not working on ipad how to show controls
http://www.jplayer.org/latest/quick-start-guide/example-audio-soundtrack/

mobile app for interacting with camera with html5?

I want to develop a mobile app for image capturing with camera, initially i wanted to use phonegap and tried downloading and installing the cordovastarter template for my visual studio2010, but all the versiosn of phonegap are giving me the error...'the project type is not supported by this installation' so want to drop the idea of using phonegap, so the next thing is, is it possible to interact with camera using by using only html5 without the help of phonegap?
note:im using mvc3 framework
its very much posible to interact with the camera using HTML5 media API, but the support is not yet confirmed. Hence, might not work as you'd expect:
HTML part:
<video id="video" width="640" height="480" autoplay></video>
<button id="snap">Snap Photo</button>
<canvas id="canvas" width="640" height="480"></canvas>
and the javascript goes like this:
// Put event listeners into place
window.addEventListener("DOMContentLoaded", function() {
// Grab elements, create settings, etc.
var canvas = document.getElementById("canvas"),
context = canvas.getContext("2d"),
video = document.getElementById("video"),
videoObj = { "video": true },
errBack = function(error) {
console.log("Video capture error: ", error.code);
};
// Put video listeners into place
if(navigator.getUserMedia) { // Standard
navigator.getUserMedia(videoObj, function(stream) {
video.src = stream;
video.play();
}, errBack);
} else if(navigator.webkitGetUserMedia) { // WebKit-prefixed
navigator.webkitGetUserMedia(videoObj, function(stream){
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errBack);
}}, false);
Hope it helps, source here.

Resources