Cordova Plug-in (Screenshot) on ionic 2 Does Not Work

Asked 2 years ago, Updated 2 years ago, 87 views

I would like to use the screenshot function of ionic2, but an error occurs and it does not run.
Also, I get an error when I download and run another sample using a screenshot.I think it's an environmental problem, but I don't know how to deal with it.Thank you in advance.

console.log(this.screenshot);
console.log (this.screenshot.save);
This.screenshot.save('jpg', 80, 'mysscreenshot.jpg') .then(this.onSuccess, 
this.onError);

Runtime console.log↓

Screenshot{}

function(format, quality, filename) {
    return new Promise (function(resolve, reject) {
        navigator.screenshot.save(function(error,result){
            if(error){
                …

TypeError: Cannot read property 'save' of undefined
at index.js:54
at newt (polyfills.js:3)
at Screenshot.save (index.js:53)
at HelloIonicPage.takeScreenShot (hello-ionic.ts:22)
at Object.eval [as handleEvent] (HelloIonicPage.html:43)
athandleEvent (core.es5.js:11852)
at callWithDebugContext (core.es5.js:13060)
at Object.debugHandleEvent [as handleEvent] (core.es5.js: 12648)
at dispatchEvent (core.es5.js:8830)
at core.es5.js —9419
at HTMLButtonElement.<anonymous> (platform-browser.es5.js:2674)
att.invokeTask (polyfills.js:3)
at Object.onInvokeTask (core.es5.js:4136)
att.invokeTask (polyfills.js:3)
at n.runTask (polyfills.js:3)
               …

Below is my ionic information.

global packages:
@ionic/cli-utils —1.3.0
Ionic CLI: 3.3.0

local packages:
@ionic/app-scripts: 1.3.0
@ionic/cli-plugin-ionic-angular: 1.3.0
Ionic Framework: ionic-angular 3.0.1

System:
Node—v7.10.0
OS: Windows 7
Xcode:not installed
ios-deploy —Not installed
ios-sim —Not installed

package.json

{
  "name": "ionic-hello-world",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private"—true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "4.0.0",
    "@angular/compiler": "4.0.0",
    "@angular/compiler-cli": "4.0.0",
    "@angular/core": "4.0.0",
    "@angular/forms": "4.0.0",
    "@angular/http": "4.0.0",
    "@angular/platform-browser": "4.0.0",
    "@angular/platform-browser-dynamic": "4.0.0",
    "@ionic-native/core": "^3.4.2",
    "@ionic-native/screenshot": "^3.4.4",
    "@ionic-native/splash-screen": "3.4.2",
    "@ionic-native/status-bar": "3.4.2",
    "@ionic/storage": "2.0.1",
    "ionic-angular": "3.0.1",
    "ionics": "3.0.0",
    "rxjs": "5.1.1",
    "sw-toolbox": "3.4.0",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "@ionic/app-scripts": "1.3.0",
    "@ionic/cli-plugin-ionic-angular": "1.3.0",
    "typescript": "~2.2.1"
  },
  "cordovaPlugins":[
    "cordova-plugin-whitelist",
    "cordova-plugin-console",
    "cordova-plugin-statusbar",
    "cordova-plugin-device",
    "cordova-plugin-splashscreen",
    "ionic-plugin-keyboard"
  ],
  "cordovaPlatforms": [
    "ios",
    {
      platform: "ios",
      "version":",
      "locator": "ios"
    }
  ],
  "description": "screenShot: An Ionic project"
}

Thank you in advance.

This is a postscript.
Imported and configured Platform.

I changed it like that, but

 undefined is not an object (evaluating 'navigator.screenshot.URI')

This error appears.
Most of the samples are set to constructors, but there are no such restrictions, are there?
I'd like to move it when you click the button.

onClickSS(){
  This.platform.ready().then()=>{
    This.screenshot.URI(80)
    .then(res=>{
      console.log('ok');
    })
    .catch(e)=>{
      let confirm = this.alertCtrl.create({
        title: 'ss Err',
        subTitle: e,
        buttons: ['OK']
      });
      confirm.present();
      console.error(e);
    });
  });    
}

Also, it is displayed only during the actual display in ionic view, and the ionic save time was the same as the previous error message.↓

 myset-result.ts:170 TypeError: Cannot read property 'URI' of undefined
at index.js —73
at newt (polyfills.js:3)
atScreenshot.URI (index.js:72)
at myset-result.ts:140
att.invoke (polyfills.js:3)
at Object.onInvoke (core.es5.js:4145)
att.invoke (polyfills.js:3)
at n.run (polyfills.js:3)
at polyfills.js:3
att.invokeTask (polyfills.js:3)
at Object.onInvokeTask (core.es5.js:4136)
att.invokeTask (polyfills.js:3)
at n.runTask (polyfills.js:3)
ata(polyfills.js:3)
at HTMLButtonElement.invoke(polyfills.js:3)

In addition, I saw the answer to shift the time with setTimeout on another page, but there was no change.

Additional
It seems to be installed.

cordova plugins
✔Running command-done!
com.darktalker.cordova.screenshot0.1.5 "Screenshot"
cordova-plugin-admobpro 2.28.3 "AdMob Plugin Pro"
cordova-plugin-console 1.0.5 "Console"
cordova-plugin-device 1.1.4 "Device"
cordova-plugin-extension 1.5.1 "Cordova Plugin Extension"
cordova-plugin-splashscreen 4.0.2 "Splashscreen"
cordova-plugin-statusbar 2.2.1 "StatusBar"
cordova-plugin-whitelist 1.3.1 "Whitelist"
cordova-sqlite-storage 2.0.3 "Cordova sqlite storage plugin"
ionic-plugin-keyboard 2.2.1 "Keyboard"

Also, as Native's socialSharing worked to the end without any problems, this feature is more likely to be a problem.

cordova ionic2

2022-09-30 16:54

1 Answers

This can be due to one or more of the following:

All ionic-native features should be invoked after the platform.ready() completes, as shown on page.
The screenshot instance is not generated when the device is not ready.
Therefore, a reference error occurred while navigator.screenshot remained undefined.

Make sure that the appropriate Cordova plug-in (Screenshot) is installed.

ionic cordova plugin list

If the Screenshot plug-in is installed, the list includes:

com.darktalker.cordova.screenshot0.1.5 "Screenshot"

If not, refer to the Screeshot page in Ionic to install the plug-in.
All @ionic-native depend on the Cordova plug-in.
If you have not installed the appropriate Cordova plug-in, it will not work.

ionic cordova plugin add https://github.com/gitawego/cordova-screenshot.git

Because Cordova plug-ins use device functionality, most plug-ins do not work with ionic serve.Please check on the actual machine.
Also, if you are using Ionic view for verification, only plugins that support Ionic view will work.It seems that Screenshot is not included.
Run with ionic cordova run<platform> from the command line


2022-09-30 16:54

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.