2016-10-20 5 views
0

Я не могу назвать плагин камеры cordova со страницы html, развернутой на сервере. Он работает нормально, если страница находится в самом приложении. Это гибридное приложение, созданное с использованием apache cordova, где, если мы откроем приложение, откроется html-страница, в которой, если мы нажмем кнопку захвата изображения, вызывается плагин камеры и открывается камера устройства. но когда я нажимаю кнопку захвата, ничего не происходит.Плагин камеры Cordova не работает

var app = { 
 
    // Application Constructor 
 
    initialize: function() { 
 
     this.bindEvents(); 
 
    }, 
 
    // Bind Event Listeners 
 
    // 
 
    // Bind any events that are required on startup. Common events are: 
 
    // 'load', 'deviceready', 'offline', and 'online'. 
 
    bindEvents: function() { 
 
     document.addEventListener('deviceready', this.onDeviceReady, false); 
 
    }, 
 
    // deviceready Event Handler 
 
    // 
 
    // The scope of 'this' is the event. In order to call the 'receivedEvent' 
 
    // function, we must explicitly call 'app.receivedEvent(...);' 
 
    onDeviceReady: function() { 
 
     app.receivedEvent('deviceready'); 
 
\t \t 
 
\t \t document.getElementById("captureImage").addEventListener("click", captureImage); 
 
\t \t 
 

 
\t \t 
 
    }, 
 
    // Update DOM on a Received Event 
 
    receivedEvent: function(id) { 
 
     var parentElement = document.getElementById(id); 
 
     var listeningElement = parentElement.querySelector('.listening'); 
 
     var receivedElement = parentElement.querySelector('.received'); 
 

 
     listeningElement.setAttribute('style', 'display:none;'); 
 
     receivedElement.setAttribute('style', 'display:block;'); 
 

 
     console.log('Received Event: ' + id); 
 
    } 
 
}; 
 

 
app.initialize(); 
 

 

 
document.getElementById("captureImage").addEventListener("click", captureImage); 
 
document.getElementById("selectImageFromGallery").addEventListener("click", selectImageFromGallery); 
 
document.getElementById("uploadFile").addEventListener("click", uploadFile); 
 

 

 

 
//data uri method 
 

 
function captureImage() { 
 

 
    navigator.camera.getPicture(onSuccess, onFail, { 
 
     quality: 50, 
 
\t targetWidth:200, 
 
\t targetHeight:200, 
 
\t allowEdit : false, 
 
\t saveToPhotoAlbum: true, 
 
\t encodingType: Camera.EncodingType.JPEG, 
 
\t destinationType: Camera.DestinationType.DATA_URL 
 
\t //destinationType: Camera.DestinationType.FILE_URL 
 
    }); 
 

 
    function onSuccess(imageData) { 
 
     var image = document.getElementById('myImage'); \t 
 
     image.src = "data:image/jpeg;base64," + imageData; 
 
\t //console.log(image.src); 
 
\t console.log(imageData); 
 
\t alert(imageData); 
 
\t  
 
    } 
 

 
    function onFail(message) { 
 
     alert('Failed because: ' + message); 
 
\t console.log(message); 
 
    } 
 
    
 
}
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
 
<html> 
 
<head> 
 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
 
<title>Insert title here</title> 
 
</head> 
 
<body> 
 

 

 
<div class="app"> 
 
      
 
\t \t \t <img id = "myImage"></img> 
 
      <button id = "captureImage">CAPTURE IMAGE</button> 
 
\t \t \t 
 
      <div id="deviceready" class="blink"> 
 
       <p class="event listening">Connecting to Device</p> 
 
       <p class="event received">Device is Ready</p> 
 
      </div> 
 
     </div> 
 
     <script type="text/javascript" src="cordova.js"></script> 
 
     <script type="text/javascript" src="js/index.js"></script> 
 
     
 

 

 
</body> 
 
</html>

+0

у вас есть правильный cordova.js на вашем сервере? – jcesarmobile

+0

да .. что все js нам нужно на сервере? – Dipanshu

+0

Нет, вам, вероятно, нужно больше вещей, вам нужно загрузить все на «platform/android/assets/www /» для Android-приложения и всего на «platform/ios/www» для приложений iOS. – jcesarmobile

ответ

0

Стараюсь код с плагином Cordova камеры, и она работает.

У вас есть такое разрешение, в вашем AndroidManifest.xml:

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

А вот мой cordova_plugins.js:

cordova.define('cordova/plugin_list', function(require, exports, module) { 
module.exports = [ 
    { 
     "file": "plugins/cordova-plugin-camera/www/CameraConstants.js", 
     "id": "cordova-plugin-camera.Camera", 
     "clobbers": [ 
      "Camera" 
     ] 
    }, 
    { 
     "file": "plugins/cordova-plugin-camera/www/CameraPopoverOptions.js", 
     "id": "cordova-plugin-camera.CameraPopoverOptions", 
     "clobbers": [ 
      "CameraPopoverOptions" 
     ] 
    }, 
    { 
     "file": "plugins/cordova-plugin-camera/www/Camera.js", 
     "id": "cordova-plugin-camera.camera", 
     "clobbers": [ 
      "navigator.camera" 
     ] 
    }, 
    { 
     "file": "plugins/cordova-plugin-camera/www/CameraPopoverHandle.js", 
     "id": "cordova-plugin-camera.CameraPopoverHandle", 
     "clobbers": [ 
      "CameraPopoverHandle" 
     ] 
    }, 
    { 
     "file": "plugins/cordova-plugin-inappbrowser/www/inappbrowser.js", 
     "id": "cordova-plugin-inappbrowser.inappbrowser", 
     "clobbers": [ 
      "cordova.InAppBrowser.open", 
      "window.open" 
     ] 
    } 
]; 
module.exports.metadata = 
// TOP OF METADATA 
{ 
    "cordova-plugin-whitelist": "1.3.2", 
    "cordova-plugin-compat": "1.2.0", 
    "cordova-plugin-camera": "2.4.1", 
    "cordova-plugin-inappbrowser": "1.7.1" 
}; 
// BOTTOM OF METADATA 
}); 

И в config.xml:

<?xml version='1.0' encoding='utf-8'?> 
<widget id="com.melvita.photo" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
    <preference name="loglevel" value="DEBUG" /> 
    <feature name="Whitelist"> 
     <param name="android-package" value="org.apache.cordova.whitelist.WhitelistPlugin" /> 
     <param name="onload" value="true" /> 
    </feature> 
    <feature name="Camera"> 
     <param name="android-package" value="org.apache.cordova.camera.CameraLauncher" /> 
    </feature> 
    <feature name="InAppBrowser"> 
     <param name="android-package" value="org.apache.cordova.inappbrowser.InAppBrowser" /> 
    </feature> 
    <allow-intent href="market:*" /> 
    <name>melvita photo</name> 
    <description> 
     A sample Apache Cordova application that responds to the deviceready event. 
    </description> 
    <author email="[email protected]" href="http://cordova.io"> 
     Apache Cordova Team 
    </author> 
    <content src="index.html" /> 
    <access origin="*" /> 
    <allow-intent href="http://*/*" /> 
    <allow-intent href="https://*/*" /> 
    <allow-intent href="tel:*" /> 
    <allow-intent href="sms:*" /> 
    <allow-intent href="mailto:*" /> 
    <allow-intent href="geo:*" /> 
</widget> 

Проверьте этот файл, или если есть разница, я тестировал на Android 6 API 23 на заметке Meizu M5.

Также попробуйте свой код, локальной, если это работает, это означает, что вы не можете выполнить камеру из удаленного сервера (убедитесь, что ваш URL объявлен в config.xml)

<allow-intent href="http://your_url.com/*" /> 
<allow-intent href="https://your_url.com/*" /> 

Стараюсь от удаленного сервер, и я получил эту ошибку в студии Android:

Not implemented reached in virtual void android_webview::AwAutofillClient::OnFirstUserGestureObserved() 
Смежные вопросы