Opening external links and other apps from an Ionic app


I would like to know how I can open others apps in my phone like Youtube or the native video player. I have a lot of problems embedding videos with the cordova video player. Indeed, I know that the tag doesn’t work very well in Android devices.

I want to create a sharing video app and I’ve implemented a solution that I thought that it would work:

  1. The videos are uploaded from the Camera to my server using cordova FileTransfer
  2. I’m using the module ffmpeg in backend to get a thumbnail from my video (.mp4)
  3. I show the thumbnails in my device
  4. When user wants to see a video, tap on the thumbnails and video file is downloaded from the server and is located in the device (in a project folder)

Until here, everything is working well. I’ve failed in the next and last step.
I’ve tried a lot of options.

  • Embedding the video file using the tag
  • Embedding the file in a iframe
  • Calling the cordova-media plugin (play() method)

But i didn’t get it work. Someone would help me?

Thanks in advance!

Have you tried use the html video tags with a remote source?

What do you mean for remote source?

You can open another app programmatically via cordova., {openExternal: true}); 

For example, if your link is of format market://details? , the play store market will be opened with the listing of the app with the id as the landing page.

I’m not sure about the structure of the youtube:// links though

1 Like

Thanks, I’m calling directly to the url

Hi Pablo! the <video src="localfile.mp4"></video> isn’t working ?


have you achieved to solve the problem?
I have similar problem , but In my case i try to download from the server and the file is located in the device (in the folder that retrieves cordova.file.dataDirectory ) . ths folder is supposed to be /data/data/app-id/files/
I use this code:

            var targetPath = cordova.file.dataDirectory + video_SD; 

            $, targetPath, {}, true).then(function(result) {
                // Success!
                alert("Ok la descarga: "+ JSON.stringify(result));


but when i look inside this folder, nothing appears:

maybe is a matter of permissions? does anybody know what is happening? thank you in advance

FYI, i have solved this problem.

In order to download the files properly, the right targetpath must be:
var targetPath = cordova.file.externalDataDirectory + video_SD;

and here is the URL ready to be used in video src tag :
$scope.srcFile = result.toNativeURL();


“cordova.file.dataDirectory” it points the path of apps data directory and i can’t be acessed outside d app . if u want to acess it u need to embed player into app to access the file or else u can try “cordova.file.externalDataDirectory” to view the contents in sdcard

$cordovaFile.checkFile(cordova.file.dataDirectory, filename)
  		.then(function (success) {
			$ionicModal.fromTemplateUrl('templates/audioplayer.html', {
  				scope: $scope,
  				animation: 'slide-in-up'
				}).then(function(modal) {
  				$scope.modal = modal;
		   	//plays audio
				$scope.specificAudioListURL=(cordova.file.dataDirectory + filename); // calls API service to get the specific audio URL
				$scope.audioplayer = {
					sources: [
		    	        { src: $scope.specificAudioListURL, type: "audio/mpeg"}
					theme: {
		        		url: ""
		},function (error) {
	    	var targetPath = cordova.file.dataDirectory + filename;
		    var trustHosts = true;
		    var options = {};
    		$, targetPath, options, trustHosts)
  			.then(function(result) {
    			// Success!
  			}, function(err) {
    			// Error
  			}, function (progress) {
    			$timeout(function () {
      				$scope.downloadProgress = (progress.loaded / * 100;
						template: 'Downloading.. '

audio player

<div ng-controller="CategoryDetailModelCtrl">
      <div class="videogular-container">
        <videogular vg-theme="audioplayer.theme.url" class="videogular-container audio">
          <vg-media vg-src="audioplayer.sources" vg-type="audio"></vg-media>
            <vg-time-display>{{ currentTime | date:'mm:ss':'+0000' }}</vg-time-display>
            <vg-time-display>{{ timeLeft | date:'mm:ss':'+0000' }}</vg-time-display>