无法让 PhoneGap 访问 IOS 摄像头。按钮问题
Cant get PhoneGap to access IOS camera. Button issues
我无法让我的按钮单击并访问我的相机和其他功能。
我的 HTML 部分代码。我确实安装了所有必要的插件。而且我能够查看我创建的按钮。但是单击它们时没有任何反应。
<div class="row">
<div class="col-sm-2"> </div>
<div id="imgDiv" class="col-sm-5 col-xs-11 thumbnail">
<img src="#" alt="Image" id="img" />
<div class="text-center">
<button type="button" class="btn btn-primary" id="btPhotoLib">Photo</button>
<button type="button" class="btn btn-primary active" id="btCamera">Camera</button>
<button type="button" class="btn btn-primary" id="btUpload">Upload</button>
</div>
</div>
</div>
我的 JS 文件:
var imgURI;
var serverURL ="ajlnfioej/upload.php";
$(document).ready(function(){
document.addEventListener('deviceready', getCameraReady, false);
});
function getCameraReady(){
$('#btCamera').on('click', function(e){
options = {quality:50, destinationType: Camera.Destination.FILE_URI, sourceType: pictureSource.CAMERA};
navigator.camera.getPicture(photoSuccess, photoFail,[options]);
});
$('#btPhotoLib').on('click', function(e){
options = {quality:50, destinationType: Camera.Destination.FILE_URI, sourceType: pictureSource.PHOTOLIBRARY};
navigator.camera.getPicture(photoSuccess, photoFail,[options]);
});
$('#btUpload').on('click', function(e){
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = imgURI.substr(imgURI.lastIndexOf('/')+1);
options.mimeType = "image/jpeg";
var ft = new FileTransfer();
var server = encodeURI(serverURL);
ft.upload(imgURI, server,uploadSuccess, uploadFail,options);
});
}
function photoSuccess(uri){
$("#img").attr("src", uri);
$("#img").css("width": "100%", "height": "100%");
imgURI = uri;
}
function cameraError(message){
navigator.notification.alert("camera usage not supported on this device");
}
function uploadSuccess(result){
navigator.camera.cleanup();
navigator.notification.alert("Number of bytes is : " + results.bytesSent);
navigator.notification.alert("Http Response is : " +results.response );
function uploadFail(){
alert("Am error has occured: Code = " + error.code);
}
我已经检查了你的代码并让它工作了。它已经在 Android 和 iOS 上进行了测试,但是我无法测试上传。
我已更正您的 javascript 中的一些语法错误(缺少一些大括号以及其他一些小问题)。
当使用JQuery添加多个css标签时,你必须给它一个对象,看起来你只是错过了大括号。
添加到 photoFail 函数中,因为它已被使用但未定义。
为错误函数添加了错误参数。
Camera.getPicture
options 参数需要一个对象,但它被赋予了一个数组。
Camera.Destination
没有定义,应该是Camera.DestinationType
.
pictureSource
没有定义,应该是Camera.PictureSourceType
.
我从检查 cordova-plugin-camera documentation 得到了大部分信息。我建议通读一下。
这是工作代码。您可以查看所有更改 here.
var imgURI;
var serverURL ="ajlnfioej/upload.php";
$(document).ready(function(){
document.addEventListener('deviceready', getCameraReady, false);
});
function getCameraReady(){
$('#btCamera').on('click', function(e){
var options = {quality:50, destinationType: Camera.DestinationType.FILE_URI, sourceType: Camera.PictureSourceType.CAMERA};
navigator.camera.getPicture(photoSuccess, photoFail, options);
});
$('#btPhotoLib').on('click', function(e){
var options = {quality:50, destinationType: Camera.DestinationType.FILE_URI, sourceType: Camera.PictureSourceType.PHOTOLIBRARY};
navigator.camera.getPicture(photoSuccess, photoFail, options);
});
$('#btUpload').on('click', function(e){
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = imgURI.substr(imgURI.lastIndexOf('/')+1);
options.mimeType = "image/jpeg";
var ft = new FileTransfer();
var server = encodeURI(serverURL);
ft.upload(imgURI, server,uploadSuccess, uploadFail,options);
});
}
function photoSuccess(uri){
$("#img").attr("src", uri);
$("#img").css({"width": "100%", "height": "100%"});
imgURI = uri;
}
function cameraError(message){
navigator.notification.alert("camera usage not supported on this device");
}
function uploadSuccess(result){
navigator.camera.cleanup();
navigator.notification.alert("Number of bytes is : " + result.bytesSent);
navigator.notification.alert("Http Response is : " +result.response );
}
function uploadFail(error){
alert("Am error has occured: Code = " + error.code);
}
function photoFail(error){
alert("Am error has occured: Code = " + error.code);
}
我无法让我的按钮单击并访问我的相机和其他功能。
我的 HTML 部分代码。我确实安装了所有必要的插件。而且我能够查看我创建的按钮。但是单击它们时没有任何反应。
<div class="row">
<div class="col-sm-2"> </div>
<div id="imgDiv" class="col-sm-5 col-xs-11 thumbnail">
<img src="#" alt="Image" id="img" />
<div class="text-center">
<button type="button" class="btn btn-primary" id="btPhotoLib">Photo</button>
<button type="button" class="btn btn-primary active" id="btCamera">Camera</button>
<button type="button" class="btn btn-primary" id="btUpload">Upload</button>
</div>
</div>
</div>
我的 JS 文件:
var imgURI;
var serverURL ="ajlnfioej/upload.php";
$(document).ready(function(){
document.addEventListener('deviceready', getCameraReady, false);
});
function getCameraReady(){
$('#btCamera').on('click', function(e){
options = {quality:50, destinationType: Camera.Destination.FILE_URI, sourceType: pictureSource.CAMERA};
navigator.camera.getPicture(photoSuccess, photoFail,[options]);
});
$('#btPhotoLib').on('click', function(e){
options = {quality:50, destinationType: Camera.Destination.FILE_URI, sourceType: pictureSource.PHOTOLIBRARY};
navigator.camera.getPicture(photoSuccess, photoFail,[options]);
});
$('#btUpload').on('click', function(e){
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = imgURI.substr(imgURI.lastIndexOf('/')+1);
options.mimeType = "image/jpeg";
var ft = new FileTransfer();
var server = encodeURI(serverURL);
ft.upload(imgURI, server,uploadSuccess, uploadFail,options);
});
}
function photoSuccess(uri){
$("#img").attr("src", uri);
$("#img").css("width": "100%", "height": "100%");
imgURI = uri;
}
function cameraError(message){
navigator.notification.alert("camera usage not supported on this device");
}
function uploadSuccess(result){
navigator.camera.cleanup();
navigator.notification.alert("Number of bytes is : " + results.bytesSent);
navigator.notification.alert("Http Response is : " +results.response );
function uploadFail(){
alert("Am error has occured: Code = " + error.code);
}
我已经检查了你的代码并让它工作了。它已经在 Android 和 iOS 上进行了测试,但是我无法测试上传。
我已更正您的 javascript 中的一些语法错误(缺少一些大括号以及其他一些小问题)。
当使用JQuery添加多个css标签时,你必须给它一个对象,看起来你只是错过了大括号。
添加到 photoFail 函数中,因为它已被使用但未定义。
为错误函数添加了错误参数。
Camera.getPicture
options 参数需要一个对象,但它被赋予了一个数组。Camera.Destination
没有定义,应该是Camera.DestinationType
.pictureSource
没有定义,应该是Camera.PictureSourceType
.
我从检查 cordova-plugin-camera documentation 得到了大部分信息。我建议通读一下。
这是工作代码。您可以查看所有更改 here.
var imgURI;
var serverURL ="ajlnfioej/upload.php";
$(document).ready(function(){
document.addEventListener('deviceready', getCameraReady, false);
});
function getCameraReady(){
$('#btCamera').on('click', function(e){
var options = {quality:50, destinationType: Camera.DestinationType.FILE_URI, sourceType: Camera.PictureSourceType.CAMERA};
navigator.camera.getPicture(photoSuccess, photoFail, options);
});
$('#btPhotoLib').on('click', function(e){
var options = {quality:50, destinationType: Camera.DestinationType.FILE_URI, sourceType: Camera.PictureSourceType.PHOTOLIBRARY};
navigator.camera.getPicture(photoSuccess, photoFail, options);
});
$('#btUpload').on('click', function(e){
var options = new FileUploadOptions();
options.fileKey = "file";
options.fileName = imgURI.substr(imgURI.lastIndexOf('/')+1);
options.mimeType = "image/jpeg";
var ft = new FileTransfer();
var server = encodeURI(serverURL);
ft.upload(imgURI, server,uploadSuccess, uploadFail,options);
});
}
function photoSuccess(uri){
$("#img").attr("src", uri);
$("#img").css({"width": "100%", "height": "100%"});
imgURI = uri;
}
function cameraError(message){
navigator.notification.alert("camera usage not supported on this device");
}
function uploadSuccess(result){
navigator.camera.cleanup();
navigator.notification.alert("Number of bytes is : " + result.bytesSent);
navigator.notification.alert("Http Response is : " +result.response );
}
function uploadFail(error){
alert("Am error has occured: Code = " + error.code);
}
function photoFail(error){
alert("Am error has occured: Code = " + error.code);
}