Cordova Plugin Camera Not Working in Android 8.0, Cannot Capture Image

1k Views Asked by At

I searched varies post online about Cordova Plugin Camera to working in Android 8.0. My problem is captured image cannot be done in Android 8.0. There's some suggestion to use File Folder to capture images but how to make it work in current code?

Screen Shot

Click Here for Screen Shot of Error Message

My code in html file:

<!DOCTYPE html>

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">

<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/signature-pad.css">

<script src="js/jspdf.min.js"></script>

<script type="text/javascript" charset="utf-8">

document.addEventListener("deviceready", onDeviceReady, false);
var pictureSource;
var destinationType;
var imageData1;

function onDeviceReady() {
  pictureSource = navigator.camera.PictureSourceType;
  destinationType = navigator.camera.DestinationType;
}

function onPhotoURISuccess1(imageData) {
  var smallImage = document.getElementById('photo1');
  smallImage.style.display = 'block';
  smallImage.src = "data:image/jpeg;base64," + imageData;
  imageData1 = imageData;
}

function capturePhoto1() {
  navigator.camera.getPicture(onPhotoURISuccess1, onFail, {
    quality: 50,
    destinationType: destinationType.DATA_URL,
    saveToPhotoAlbum: true,
  });
}

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

//Generate pdf
function generatePdf() {
  alert("Generating pdf ... please wait ...");
  var doc = new jsPDF();

  doc.text(10, 40, "Photo 1:");
  var imgData1 = 'data:image/jpeg;base64,' + imageData1;
  doc.addImage(imgData1, 'JPEG', 10, 50, 90, 100);

  var myBase64 = window.btoa(pdfOutput);

  var contentType = "application/pdf";
  var folderpath = cordova.file.externalApplicationStorageDirectory;
  var filename = "testing.pdf";

  savebase64AsPDF(folderpath, filename, myBase64, contentType);

}

function savebase64AsPDF(folderpath, filename, content, contentType) {
  // Convert the base64 string in a Blob
  var DataBlob = b64toBlob(content, contentType);

  window.resolveLocalFileSystemURL(folderpath, function (dir) {
    dir.getFile(filename, { create: true }, function (file) {
      file.createWriter(function (fileWriter) {
        //fileWriter.write("Testing");
      }, function () {
        alert('Unable to save file in path ' + folderpath);
      });
    });
  });
}

function b64toBlob(b64Data, contentType, sliceSize) {
  contentType = contentType || '';
  sliceSize = sliceSize || 512;

  var byteCharacters = atob(b64Data);
  var byteArrays = [];

  for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) 
 {
    var slice = byteCharacters.slice(offset, offset + sliceSize);

    var byteNumbers = new Array(slice.length);
    for (var i = 0; i < slice.length; i++) {
      byteNumbers[i] = slice.charCodeAt(i);
    }

    var byteArray = new Uint8Array(byteNumbers);

    byteArrays.push(byteArray);
  }

  var blob = new Blob(byteArrays, { type: contentType });
  return blob;
}


//Write to A PDF
function savebase64AsPDF(folderpath, filename, content, contentType) {

  // Convert the base64 string in a Blob
  var DataBlob = b64toBlob(content, contentType);
  window.resolveLocalFileSystemURL(folderpath, function (dir) {
    dir.getFile(filename, { create: true }, function (file) {

      alert("A pdf file is created succesfully.");

      file.createWriter(function (fileWriter) {
        fileWriter.write(DataBlob);

      }, function () {
        alert("Unable to save file in path: " + folderpath);
      });
    });
  });

}
</script>

</head>

<body onselectstart="return false">
<div class="col-lg-12" style="margin:0 auto;text-align:center">
<center>
<img src="css/images/logo.png" alt="logo" width="50%" height="15%" /><br> 
<hr><br>
<button type="button" onclick="capturePhoto1();" style="margin-bottom:1%">Upload Photo 1</button><br>
<img style="display:none;width:90%;height:2%" id="photo1" src="" /><br>
<br>
<label>Number</label><br>
<input type="text" name="carPlate" id="carPlate" style="border:1px solid;margin-top:2%" />

</center>
</div>
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
1

There are 1 best solutions below

1
On

I get an error when using "saveToPhotoAlbum: true" after upgrading to Android v.8. If i disable this I can take pictures again.