Getting YouTube videos to play again in Ionic6

*** To get the working explanation, continue down the page ***

For the longest time, it was as simple as adding a few lines of code.

$ ionic cordova plugin add cordova-plugin-youtube-video-player
$ npm install @awesome-cordova-plugins/youtube-video-player

But, back in mid 2021, this changed and since then, videos haven’t worked properly, or at all for iOS users. Sure, it worked fine on Android devices, but developers have been playing catch up after YouTube removed an API call, which basically broke things and XCDYouTubeKit hasn’t been updated recently for handling the changes.

In my logs, I was getting the error: ‘XCDYouTubeVideoErrorDomain error -3

An emergency hotfix has been suggested, but still not deployed for this as per here:

But, it was ‘markdegrootnl’ who posted the following fix:

$ cordova plugin add

My app took a long time to build after running this, as it had to reload/compile/clone the new cocoapod files, and it worked again.

Is it the best experience for the user? No, because it takes a long time for videos to load. But, it’s a work around for the moment, until maybe a better fix can be made.

***** Update:

While this ‘fix’ is in place, it appears that the data from Youtube runs at about 80kb/s which is not enough to make this update feasible. I’m still looking for answers on this though.

****** UPDATE: 20220525 – actual solution is still down further.

I had a bit more of a think about this and discovered the following solution:

Please see this URL for more details and context on how to solve this, and what is exactly going on, and what has been solved:

The Solution:
Firstly, the Podfile needs to be updated.

This is my current Podfile: ios/App/Podfile

platform :ios, '12.0'

# workaround to avoid Xcode caching of Pods that requires
# Product -> Clean Build Folder after new Cordova plugins installed
# Requires CocoaPods 1.6 or newer
install! 'cocoapods', :disable_input_output_paths => true

def capacitor_pods
  pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
  pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
  pod 'CapacitorApp', :path => '../../node_modules/@capacitor/app'
  pod 'CapacitorHaptics', :path => '../../node_modules/@capacitor/haptics'
  pod 'CapacitorKeyboard', :path => '../../node_modules/@capacitor/keyboard'
  pod 'CapacitorStatusBar', :path => '../../node_modules/@capacitor/status-bar'
  pod 'CapacitorYoutubePlayer', :path => '../../node_modules/capacitor-youtube-player'  
  pod 'XCDYouTubeKit', :git => '', :branch => 'master'  
  pod 'CordovaPlugins', :path => '../capacitor-cordova-ios-plugins'
  pod 'CordovaPluginsStatic', :path => '../capacitor-cordova-ios-plugins'
  pod 'CordovaPluginsResources', :path => '../capacitor-cordova-ios-plugins'

target 'App' do
  # Add your Pods here

This is the GIT change:

- pod 'XCDYouTubeKit', :git => '', :branch => 'master'
+ pod 'XCDYouTubeKit', :git => '', :branch => 'master'

To make sure the change happened correctly, I downloaded the MASTER code branch from here:

I copied the contents of that zip file to my project: ios/App/Pods/XCDYouTubeKit/XCDYouTubeKit/

Whether or not it was important, did a clean build in XCode, built it and loaded it to 2 physical devices and it worked flawlessly.

My only problem right now is with running the following commands, that it reverts to the old PodFile.

Ionic Commands:
ionic build – no problem.

npx cap sync – reverts to the old podfile setting – breaks the fix, which can be manually adjusted.

So, while the above ‘fix’ was a real bandaid fix in the true sense, it didn’t uphold.

** The Actual Solution **

What I had to do in the end was make 2 forks of code on GitHub to make this solution work for me, so that it could be automated until other developers smarter than me can make other changes to the master code trees.

You can now use the following repository:

This can be loaded via:

cordova plugin add

The other repository I had to create was: It’s not something you need to worry about, but it’s basically the Podfile engine for iOS. The current unforked version of XCDYouTubeKit is broken, and while many people have created suggestions, it hasn’t been brought in to the main trunk as yet. I found work by kbex-dev which worked, and so I had to fork it to make it integrate it in to my solution for the project to build.

I’ve tested this multiple times, and it now finally works

Other notes:

This is my list of package.json

  "name": "App Name",
  "version": "2.1.1",
  "author": "me",
  "homepage": "",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "capacitor:sync:after": "node ./configCordovaPlugin.js"
  "private": true,
  "dependencies": {
    "@angular-devkit/architect": "^0.1100.7",
    "@angular/animations": "^13.2.7",
    "@angular/common": "~13.2.7",
    "@angular/core": "^13.2.7",
    "@angular/forms": "~13.2.7",
    "@angular/platform-browser": "~13.2.7",
    "@angular/platform-browser-dynamic": "~13.2.7",
    "@angular/platform-server": "~13.2.7",
    "@angular/router": "~13.2.7",
    "@awesome-cordova-plugins/core": "^5.41.0",
    "@awesome-cordova-plugins/youtube-video-player": "^5.41.0",
    "@capacitor/android": "3.5.0",
    "@capacitor/app": "1.1.1",
    "@capacitor/core": "3.5.0",
    "@capacitor/haptics": "1.1.4",
    "@capacitor/ios": "3.5.0",
    "@capacitor/keyboard": "1.2.2",
    "@capacitor/status-bar": "1.0.8",
    "@ionic-native/core": "^5.36.0",
    "@ionic-native/document-viewer": "^5.36.0",
    "@ionic-native/file": "^5.36.0",
    "@ionic-native/file-opener": "^5.36.0",
    "@ionic-native/file-transfer": "^5.36.0",
    "@ionic-native/http": "^5.36.0",
    "@ionic-native/in-app-browser": "^5.36.0",
    "@ionic-native/network": "^5.36.0",
    "@ionic-native/splash-screen": "^5.36.0",
    "@ionic-native/sqlite": "^5.36.0",
    "@ionic-native/status-bar": "^5.36.0",
    "@ionic-native/toast": "^5.36.0",
    "@ionic-native/youtube-video-player": "^5.36.0",
    "@ionic/angular": "^6.0.16",
    "@ionic/angular-server": "^6.0.16",
    "@ionic/storage": "^2.3.1",
    "@ngx-translate/core": "^13.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "capacitor-youtube-player": "^1.0.10",
    "file-saver": "^2.0.5",
    "fsevents": "^2.3.2",
    "jetifier": "^2.0.0",
    "rxjs": "^6.6.7",
    "tslib": "^2.3.1",
    "zone.js": "~0.11.5"
  "devDependencies": {
    "@angular-devkit/build-angular": "~13.2.3",
    "@angular/cli": "~13.2.3",
    "@angular/compiler": "~13.2.2",
    "@angular/compiler-cli": "~13.2.2",
    "@angular/language-service": "~13.2.2",
    "@capacitor/cli": "3.5.0",
    "@ionic/angular-toolkit": "^6.0.0",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "^2.0.10",
    "@types/node": "^12.11.1",
    "cordova-plugin-advanced-http": "^3.3.1",
    "cordova-plugin-androidx": "^3.0.0",
    "cordova-plugin-androidx-adapter": "^1.1.3",
    "cordova-plugin-device": "^2.1.0",
    "cordova-plugin-document-viewer": "^1.0.0",
    "cordova-plugin-file": "^6.0.2",
    "cordova-plugin-file-opener2": "^3.0.5",
    "cordova-plugin-file-transfer": "git+",
    "cordova-plugin-inappbrowser": "^4.1.0",
    "cordova-plugin-ionic-keyboard": "^2.2.0",
    "cordova-plugin-ionic-webview": "^4.2.1",
    "cordova-plugin-music-controls2": "git+",
    "cordova-plugin-network-information": "^2.0.2",
    "cordova-plugin-splashscreen": "^5.0.4",
    "cordova-plugin-statusbar": "^2.4.3",
    "cordova-plugin-whitelist": "^1.3.5",
    "cordova-plugin-x-toast": "^2.7.3",
    "cordova-plugin-youtube-video-player": "git+",
    "cordova-sqlite-storage": "^5.1.0",
    "jasmine-core": "~3.8.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.3.2",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "typescript": "~4.4.4"
  "description": "A great Ionic project",
  "cordova": {
    "plugins": {
      "cordova-sqlite-storage": {},
      "cordova-plugin-advanced-http": {},
      "cordova-plugin-network-information": {},
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-file": {},
      "cordova-plugin-document-viewer": {},
      "cordova-plugin-file-opener2": {},
      "cordova-plugin-x-toast": {},
      "cordova-plugin-androidx": {},
      "cordova-plugin-androidx-adapter": {},
      "cordova-plugin-file-transfer": {},
      "cordova-plugin-inappbrowser": {},
      "cordova-plugin-youtube-video-player": {}
    "platforms": []

Hopefully this helps someone else who has been struggling with getting YouTube to work in Ionic apps again, ’cause up until recently, it hasn’t been working at all.

To get my own plugin working, I had to remove the original cordova plugin too:
See here for more help:

But I used the following command:

cordova plugin remove cordova-plugin-youtube-video-player  

I also had to remove the iOS and I also cleared out the Android paths, just to make sure everything flushed out correctly.

You may also find gem issues as well, such as mentioned on here:

On a side note, while I did like the idea of using a native capacitor solution for playing YouTub videos, I wasn’t happy with how this project worked:
I only say this as, it was one I played with. I couldn’t get full screen properly on iOS, and having the YT interface in the app didn’t really float my boat either.

This YT player thing may be a catch up with developers and YT, but we’ll see what happens in the future.

Enjoy! 😀


7 thoughts on “Getting YouTube videos to play again in Ionic6

Add yours

    1. Hi Francis. Glad you figured out the work around, I’m currently on holidays and away from the computer. I’ll have to check if I did anything weird with my build, but I knew it did work at the the time of the post. I’ll try and remember to get back to you. 😊

      1. Hi Stephen, is it possible that I still need to copy these files because I am using Capacitor ? Would it be a lot of work to make your plugin Capacitor compatible ?

  1. This is a nice solution. It works on IOS and Android 10 like a charm, but on andorid 11 or higher I get the message that I need to install the youtube app. However the youtube app is already installed. Do you got a solution for that problem?

    1. Hi Lukas, thanks. Glad it worked for you. I haven’t had that issue, sorry… It’d probably need to be taken further up the line from the code it was forked from. Do you have any screen shots available? As it turns out, my phone is on android 10, which is probably why I haven’t seen that issue…

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

Create a free website or blog at

Up ↑

%d bloggers like this: