phonegap 相机和地理定位在 android 中不能一起工作
Posted
技术标签:
【中文标题】phonegap 相机和地理定位在 android 中不能一起工作【英文标题】：phonegap camera and geolocation not working together in android 【发布时间】：2014-06-05 20:12:04 【问题描述】：请，我正在开发一个使用 phonegap 相机和地理定位的 android 应用程序。到目前为止，我可以捕获图片，但是一旦我包含了应该启用获取地理位置的代码，捕获失败并且地理位置无法出现。以下是失败的代码：
<!DOCTYPE html>
<html>
<head>
<title>Submit form</title>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<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;
navigator.geolocation.getCurrentPosition(onSuccess, onError);
// A button will call this function
//
function getPhoto()
// Retrieve image file location from specified source
navigator.camera.getPicture(onPhotoURISuccess, onFail, quality: 50,
destinationType: destinationType.FILE_URI );
function onSuccess(position)
var element = document.getElementById('geolocation');
element.innerHTML = 'Latitude: ' + position.coords.latitude + '<br />' +
'Longitude: '+ position.coords.longitude + '<br />' +
'Altitude: ' + position.coords.altitude + '<br />' +
'Accuracy: ' + position.coords.accuracy + '<br />' +
'Timestamp: ' + position.timestamp + '<br />';
// Called when a photo is successfully retrieved
//
function onPhotoURISuccess(imageURI)
// Show the selected image
var smallImage = document.getElementById('smallImage');
smallImage.style.display = 'block';
smallImage.src = imageURI;
function uploadPhoto()
//selected photo URI is in the src attribute (we set this on getPhoto)
var imageURI = document.getElementById('smallImage').getAttribute("src");
if (!imageURI)
alert('Please select an image first.');
return;
//set upload options
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = imageURI.substr(imageURI.lastIndexOf('/')+1);
options.mimeType = "image/jpeg";
options.chunkedMode = false;
options.params =
firstname: document.getElementById("firstname").value,
lastname: document.getElementById("lastname").value
options.headers =
Connection: "close"
;
var ft = new FileTransfer();
ft.upload(imageURI, encodeURI("http://mydomain.com/upload.php"),win,fail,options);
// Called if something bad happens.
//
function onFail(message)
console.log('Failed because: ' + message);
function win(r)
console.log("Code = " + r.responseCode);
console.log("Response = " + r.response);
alert("Response =" + r.response);
console.log("Sent = " + r.bytesSent);
function fail(error)
alert("An error has occurred: Code = " + error.code);
console.log("upload error source " + error.source);
console.log("upload error target " + error.target);
</script>
</head>
<body>
<button onclick="getPhoto();">Select Photo:</button><br>
<img style="display:none;width:60px;height:60px;" id="smallImage" src="" /><br>
<p id="geolocation">Finding geolocation...</p><br>
<form id="regform">
First Name: <input type="text" id="firstname" name="firstname"><br>
Last Name: <input type="text" id="lastname" name="lastname"><br>
<input type="button" id="btnSubmit" value="Submit" onclick="uploadPhoto();">
</form>
</body>
</html>
感谢您期待的帮助。
【问题讨论】：
【参考方案1】：您需要添加一个在文档加载后调用的函数，然后再添加事件监听器。
例子：
<body onload="onLoad()">
然后：
function onLoad()
document.addEventListener("deviceready",onDeviceReady,false);
这样做的原因是您在事件触发后立即调用地理定位 API，但该事件可以在需要写入数据的 html 元素之前触发。
如果等待body先加载，那么永远不会出现JS无法与html交互的情况。
【讨论】：
实际上在我之前的各种试验中，我在body标签处使用了onload。尽管我没有创建任何函数来调用 API，如上面的示例所示。我只是试一试。谢谢。 你安装了地理定位插件吗？ 我猜是因为如果我只使用地理定位代码 - 即不将它与相机代码结合起来，地理定位工作正常。以上是关于phonegap 相机和地理定位在 android 中不能一起工作的主要内容，如果未能解决你的问题，请参考以下文章
Phonegap 2.5.0 地理定位不适用于 android 4.0.4
在 Android 上使用 PhoneGap 进行地理定位仅适用于 index.html
使用 phonegap eclipse 的 Android 的 HTML5 地理定位应用程序