PhoneGap Cordova 3.0.0 navigator.camera未定义 [英] Phonegap Cordova 3.0.0 navigator.camera is undefined

问题描述

我第一次尝试使用Cordova本机插件。我开始使用相机和文档中提供的示例代码。这是失败，然而 navigator.camera 未定义。

I'm trying to use the Cordova native plugins for the first time. I started out with the camera and the sample code provided in the documentation. This is failing however and the navigator.camera is undefined.

我已经包含下面的代码。 p>

I've included the code below.

<div data-role="page" id="CameraPage">
<script type="text/javascript" charset="utf-8">

var pictureSource;   // picture source
var destinationType; // sets the format of returned value

// Wait for device API libraries to load
//
document.addEventListener("deviceready",onDeviceReady,false);

// device APIs are available
//
function onDeviceReady() {
    pictureSource=navigator.camera.PictureSourceType;
    destinationType=navigator.camera.DestinationType;
}

// Called when a photo is successfully retrieved
//
function onPhotoDataSuccess(imageData) {
  alert("Photo Data Success");
  // Uncomment to view the base64-encoded image data
  // console.log(imageData);

  // Get image handle
  //
  var smallImage = document.getElementById('smallImage');

  // Unhide image elements
  //
  smallImage.style.display = 'block';

  // Show the captured photo
  // The inline CSS rules are used to resize the image
  //
  smallImage.src = "data:image/jpeg;base64," + imageData;
}

// A button will call this function
//
function capturePhoto() {
  alert("function is called"); 
  if(_.isUndefined(navigator.camera)){
    alert("Camera is not defined");
  }else{
    alert("WTF?!");
  }
  // Take picture using device camera and retrieve image as base64-encoded string
  navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
    destinationType: destinationType.DATA_URL });
}

// Called if something bad happens.
//
function onFail(message) {
  alert('Failed because: ' + message);
}

</script>

<button onclick="capturePhoto();">Capture Photo</button> <br>
<img style="display:none;width:60px;height:60px;" id="smallImage" src="" />
<img style="display:none;" id="largeImage" src="" />

到CLI方向

cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git

我也添加了cordova.js文件。

I also added the cordova.js files.

<script type="text/javascript" charset="utf-8" src="js/cordova-js/lib/cordova.js"></script>

推荐答案

这有点旧，希望能够洞察别人以后可能会出现...

This is a bit old, but I wanted to provide hopefully for insight to anyone else that might come along later...

我遇到的问题是由于我做了一个更老的npm安装cordova的事实

The issue I was running into was caused by the fact I had done an older npm install of cordova at one point that was still on my system, and then later the npm install of phonegap.

Cordova是phonegap的依赖，所以cordova的必要版本存在，但是当我将运行插件安装：

Cordova is a dependency of phonegap so the necessary version of cordova was present, but when I would run the plugin install:

cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git

系统默认为旧版本的cordova一个结果没有得到正确的插件版本。

the system was defaulting to the old version of cordova and as a result was not getting the correct version of the plugins.

我最近再次提醒我这个问题，当我升级我的npm phonegap软件包从3.0.0到3.1.0 。再次，插件已更改，不向后兼容。在3.0.0的情况下，PhoneGap需要一个插件目录

I was reminded of this issue again recently when I upgraded my npm phonegap package from 3.0.0 to 3.1.0. Once again, the plugins changed and were not backwards compatible. In the case of 3.0.0, PhoneGap expects a plugin directory of

org.apache.cordova.core.camera
org .apache.cordova.core.X

org.apache.cordova.core.camera org.apache.cordova.core.X

在最新版本3.1.0中，核心命名空间被删除， / p>

In the latest release 3.1.0 the core namespacing was dropped and these now look like this

org.apache.cordova.camera
org.apache.cordova.X

org.apache.cordova.camera org.apache.cordova.X

在正常使用情况下，我不认为这是每天人们碰到的。我猜测的大多数项目是生成的，开发人员正在添加他们需要的插件，坚持使用特定版本的PhoneGap，直到某个时候他们决定升级项目。这里成为一个问题，我看到的是，当开发人员开始同时在多个PhoneGap项目上工作时;我在这里的情况。我升级到新版本的新项目，然后需要向旧项目添加插件 爆炸事件

In normal use scenarios I don't think this is something people run into on a daily basis. Most projects I'm guessing are being generated and the developer is adding the plugins they need and sticking to a particular release of PhoneGap until at some point maybe they decide to upgrade the project. Where this becomes an issue as I see it is when the developer starts working on multiple PhoneGap projects at the same time; the case I'm having here. I upgraded to a newer version for a new project, then needed to add plugins to the old project EXPLOSION OCCURS

到目前为止，我一直使用全局安装PhoneGap（根据phonegap.com的官方文档）

Up to this point I had been using a global install of PhoneGap (per the official documentation at phonegap.com)

sudo npm install -g phonegap

我的短期解决方案最终是从旧项目cp所需的插件目录这是使用我需要的版本到我的另一个项目，恰恰是在同一个版本上运行。我的下一步将是使用nvm测试，看看我是否能够在每个项目中使用多个安装PhoneGap，而不是总是移动全局版本。

My short term solution ended up being to cp the needed plugin directory from an old project that was using the version I needed over into my other project that happens to be running on the same version. My next steps will be to test out using nvm and see if I'm am able to use multiple installs of PhoneGap this way per project, rather than having an always shifting global version.

这篇关于PhoneGap Cordova 3.0.0 navigator.camera未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！