Ionic Cordova-video player

Asked

Viewed 460 times

1

I’m trying to add video in the app by following this tutorial : https://www.youtube.com/watch?v=E4S1yVBUPpk&t=9s

I did everything right I believe, but when I run the application with Ionic serves -c , and open in Ionic Devapp I get the message by clicking the Playvideo button:

console.warn: Native: tried Calling Videoplayer.play, but the Videoplayer plugin is not installed.

[15:49:16] console.warn: Install the Videoplayer plugin: 'Ionic Cordova plugin add https://github.com/moust/cordova-plugin-videoplayer.git'.

But I have the plugin installed, already removed and installed, I came to create other projects but always at the end returns this error as if I had not installed the plugin. It still appears in "plugins". Does anyone know what this might be? Could it be from Ionic Devapp? I don’t have an emulator to test, just devapp.
And I didn’t find many tutorials on how to video in the app. I will actually add an image, and click on it to play the video, a real "advertisement". But at first I’m trying to add the video. If anyone can help me, I’ll be very grateful. Thank you!

My Home.Ts code is :

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { VideoPlayer, VideoOptions } from '@ionic-native/video-player';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  videoOptions: VideoOptions;
  videoUrl: string;

  constructor(private videoPlayer: VideoPlayer, public navCtrl: NavController) {

  }

  async playVideo() {
    try {
      this.videoOptions = {
        volume: 0.7
      }
      this.videoUrl = "http://techslides.com/demos/sample-videos/small.mp4"
      this.videoPlayer.play(this.videoUrl, this.videoOptions)
    }
    catch (e) {
      console.error(e);
    }
  }
} 
  • Spun the ionic cordova plugin add cordova-plugin-video-player and the npm install @ionic-native/video-player --save and restarted the serve after that? Ran the commands in the project folder?

  • When you say reset the serve, what does it mean? but I ran Ionic Cordova plugin add Cordova-plugin-video-player (videoplayer without " - " ) and npm install @Ionic-Native/video-player --save within the project, both were installed.

  • You are developing via command ionic serve or directly in the emulator/phone? If it’s in the emulator/phone then ignore the restart part.

  • I am using Ionic serves, but in Chrome when I click on Play Video, gives the message that Cordova is not available in the browser. However I opened by the application Ionic devapp. and in it when I click on play video, I get the message q the plugin n has been installed

  • Oh yes it’s true, Cordova plugins only run by emulator, so does the following run command ionic doctor list, This will list possible problems.

  • typed and received this: Automatic-updates-off ------ npm-installed-locally ----- Ionic-installed-locally ------- git-not-used ---- git-config-invalid -------- Ionic-angular-update-available- ---- Ionic-angular-major-update-available-- app-scripts-update-available ---- app-scripts-major-update-available ---- Ionic-Native-old-version-installed ------ Ionic-Native-update-available ----- Ionic-Native-major-update-available ----- Unsaved-Cordova-Platforms --- Cordova-Platforms-Committed --- default-Cordova-Bundle-id-used ---- viewport-fit-not-set. ----

  • Boy, you’re in a lot of trouble :/

  • Back up your project to a ZIP or RAR, then run the command ionic doctor check

  • So all this is trouble? I’m still learning about it.. But are all the things that are there when I use the "Ionic doctor list" trouble? would like to know. I will use Ionic doctor check command

  • Yes and no, there are outdated things, old things that still work but can be replaced, and things that should already have been removed/updated. Of course it is not worth updating always, has old that works well, sometimes works better than new because of other dependencies (not that it is better in fact)

  • Thank you for replying to me @Guilhermenascimento. I received this after the command:

  • Play Store, the Bundle ID can’t be changed. This Issue was Detected because this app’s Bundle ID is "io.ionic.Starter", which is the default Bundle ID provided after running Ionic start. To fix, take the following step(s): 1) Change the id attribute of <widget> (root element) to Something other than "io.ionic.Starter" Ignore this Issue with: Ionic doctor ignore-default Cordova-Bundle-id-used

  • Vixe, is full of problem :/ including configuration of your APP. It has to create a separate project from scratch?

  • Sure. I’ll try again when I get home on another computer. Maybe the result is different, but I put the result here. and thank you again for answering me.

  • I think your NPM and your global plugins may be outdated in general :/ , it could be several problems, I had the same problem (not the same exactly), then I removed everything and installed again, I just backed up the projects, but I removed the project folder that contained the packages and reviewed package.json. Of course in my case I had to remove up to Packages.json and start a project from scratch, just copying the src and app folder (and Assets), now here is running nice

Show 10 more comments
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.