Cordova Camera Preview Plugin
当我拍照时,我收到了一个错误.我不知道如何从这个URL读取图像.我想要那个图像的base64.
这是错误图像:
这是我的HTML
<div > <div > <button ID="startCamerabutton">Start Camera at back</button> <button ID="stopCamerabutton">Stop Camera</button> </div> <div > <p><button ID="startCameraAnotherPosbutton">Start Camera at front</button></p> <p>color Effect: <select ID="colorEffectCombo"> <option selected value="none">None</option> <option value="aqua">Aqua</option> <option value="blackboard">Blackboard</option> <option value="mono">Mono</option> <option value="negative">Negative</option> <option value="posterize">Posterize</option> <option value="sepia">Sepia</option> <option value="solarize">Solarize</option> <option value="whiteboard">whiteboard</option> </select> </p> </div> <div > <button ID="takePicturebutton">Take Picture</button> <button ID="switchCamerabutton">Switch Camera</button> </div> <div > <button ID="hIDebutton">HIDe</button> <button ID="showbutton">Show</button> </div></div><div > <p><img ID="prevIEwPicture" wIDth="200"/></p> <p><img ID="originalPicture" wIDth="200"/></p></div>
这是我的app.Js
var app = { startCamera: function(){ console.log('starting camera'); // var tapEnabled = true; //enable tap take picture var dragEnabled = true; //enable prevIEw Box drag across the screen // var toBack = true; //send prevIEw Box to the back of the webvIEw var rect = {x: 100,y: 100,wIDth: 300,height:300}; cordova.plugins.cameraprevIEw.startCamera(rect,"front",dragEnabled) },stopCamera: function(){ cordova.plugins.cameraprevIEw.stopCamera(); },startCameraAnotherPos: function(){ cordova.plugins.cameraprevIEw.startCamera({x: 50,height:300,camera: "back",tapPhoto: true,prevIEwDrag: true,toBack: false}); },takePicture: function(){ console.log('taking picture..'); cordova.plugins.cameraprevIEw.takePicture({maxWIDth: 640,maxHeight: 640}); },takepicturehandler: function(){ console.log('taking..'); },switchCamera: function(){ cordova.plugins.cameraprevIEw.switchCamera(); },show: function(){ cordova.plugins.cameraprevIEw.show(); },hIDe: function(){ cordova.plugins.cameraprevIEw.hIDe(); },colorEffectChanged: function(){ var effect = document.getElementByID('colorEffectCombo').value; cordova.plugins.cameraprevIEw.setcolorEffect(effect); },init: function(){ document.getElementByID('startCamerabutton').addEventListener('click',this.startCamera,false); document.getElementByID('startCameraAnotherPosbutton').addEventListener('click',this.startCameraAnotherPos,false); document.getElementByID('stopCamerabutton').addEventListener('click',this.stopCamera,false); document.getElementByID('takePicturebutton').addEventListener('click',this.takePicture,false); document.getElementByID('switchCamerabutton').addEventListener('click',this.switchCamera,false); document.getElementByID('showbutton').addEventListener('click',this.show,false); document.getElementByID('hIDebutton').addEventListener('click',this.hIDe,false); document.getElementByID('colorEffectCombo').addEventListener('change',this.colorEffectChanged,false); cordova.plugins.cameraprevIEw.setonPictureTakenHandler(function(result){ console.log(result); document.getElementByID('originalPicture').src = result[0];//originalPicturePath; document.getElementByID('prevIEwPicture').src = result[1];//prevIEwPicturePath; }); }};document.addEventListener('deviceready',function(){ app.init();},false);解决方法 为了使图片可用,它需要临时“存储”,无论是正确的格式还是正确的路径.以下是基于承诺的函数的示例:
public base64Image:any;
公共信息:任何;
takePicture() { this.cameraPrevIEw.takePicture({ quality: 50 }).then((imageData) => { this.base64Image = 'data:image/jpeg;base64,' + imageData; },(err) => { this.message = 'Problem accessing the camera ' + err; }); }
这里,base64Image是图像的路径,您可以在img标记中使用它:
<img src="{{base64Image}}">总结
以上是内存溢出为你收集整理的如何从Cordova Camera Preview Plugin获取照片?全部内容,希望文章能够帮你解决如何从Cordova Camera Preview Plugin获取照片?所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)