在cordova/phonegap应用中如何截屏

Question

在cordova/phonegap应用中如何截屏

javascriptandroidangularjscordovacordova-plugins

4

我正在使用这个插件在我的cordova应用程序中尝试截屏，但是出现了一个错误。由于我是在我的安卓智能手机上测试它，因此我不知道错误是什么，应用程序也被阻止了。在浏览器中，同样的错误也会发生：TypeError: Cannot read property 'save' of undefined，其中“save”来自以下代码：

navigator.screenshot.save(function(error,res){
      if(error){
        console.error(error);
      }else{
        console.log('ok',res.filePath);
      }
    });

P.S.: 我还尝试了 navigator.plugin.screenshot..., navigator.plugins.screenshot, window.screenshot, window.plugin.screenshot 和 window.plugins.screenshot

P.S.2: 我在 cordova CLI 中使用 cordova plugins 检查插件是否已安装，一切正常，插件存在于插件文件夹中，且适用于 cordova 版本>=3.0.0，我的版本更高。

但是，当然，浏览器并没有真正加载插件，因为这个错误也会在那里出现：Failed to load resource: the server responded with a status of 404 (Not Found) http://localhost:23273/www/cordova_plugins.json。在我的智能手机上检查后发现未截取任何屏幕截图。

- Boyan Hristov

你是否创建了 Screenshot 对象并使用 navigator.screenshot.save？ - Dhwanik Gandhi

你在插件的xml文件中添加了平台吗？ - Dhwanik Gandhi

我在代码中使用了try-catch块，在安卓设备上报错为：无法调用未定义的save方法。 - Boyan Hristov

在 screenshot.js 的保存函数中尝试弹出消息，它是否显示了弹出消息？ - Dhwanik Gandhi

你需要执行 cordova plugin add https://github.com/gitawego/cordova-screenshot.git 然后执行 cordova prepare android。你已经执行这两个步骤了吗？ - Chitranshu Asthana

显示剩余9条评论

3个回答

1

您是否在本地主机中加载您的项目？为什么会有这种文件：

http://localhost:23273/www/cordova_plugins.json. ?

您正在尝试使用“cordova serve 23273”模拟cordova项目吗？您不能在“cordova serve”中使用任何插件。

您应该使用file:///作为协议...

- Darktalker

我也在我的智能手机上进行测试，使用try catch块时，弹出的错误是“TypeError：无法调用未定义的'save'方法”。但非常感谢您花费时间和精力帮助我。我很感激;) - Boyan Hristov

0

谢谢大家，不幸的是我无法给出一个确切的答案，因为我尝试了很多方法。最终的解决方案是更新我的cordova.js文件到最新版本，这实际上解决了我的问题，但每个评论和回答都给了我很大的帮助。

我想感谢@Talysson de Castro和@Darktalker两位帮助了我！:)

- Boyan Hristov

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Talysson de Castro · Accepted Answer

我正在使用Worklight，并遇到了同样的问题。我的解决方案是更改Screenshot.js文件的代码：

var formats = ['png','jpg'];

function Screenshot() {
}

Screenshot.prototype.save = function (callback,format,quality, filename) {
    format = (format || 'png').toLowerCase();
    filename = filename || 'screenshot_'+Math.round((+(new Date()) + Math.random()));
    if(formats.indexOf(format) === -1){
        return callback && callback(new Error('invalid format '+format));
    }
    quality = typeof(quality) !== 'number'?100:quality;
    cordova.exec(function(res){
        callback && callback(null,res);
    }, function(error){
        callback && callback(error);
    }, "Screenshot", "saveScreenshot", [format, quality, filename]);
};

Screenshot.install = function () {
      if (!window.plugins) {
        window.plugins = {};
      }

      window.plugins.screenshot = new Screenshot();
      return window.plugins.screenshot;
    };

cordova.addConstructor(Screenshot.install);

这样我可以使用以下代码进行调用:

window.plugins.screenshot.save(function(error,res){
          if(error){
            alert(error);
          }else{
            alert('ok',res.filePath); //should be path/to/myScreenshot.jpg
          }
        },'jpg',50,'myScreenShot');

这在我的安卓智能手机上完美运行。

我还在res / xml / config.xml文件中添加了：

<feature name="Screenshot">
    <param name="android-package" value="org.apache.cordova.screenshot.Screenshot"/>
</feature>

在 AndroidManifest.xml 文件中:

<uses-permission android: name = "android.permission.WRITE_EXTERNAL_STORAGE" />

将Java类添加到以下包中：org.apache.cordova.screenshot.Screenshot

所有这些配置信息都在插件的plugin.xml文件中。