如何使用Cordova Camera插件获取原始图片

要在新版Cordova中获取保留原始尺寸、格式及质量的图片，可通过cordova-plugin-camera配合cordova-plugin-file实现，具体步骤如下：

1. 安装必要插件 #

首先确保安装相机和文件操作插件：

cordova plugin add cordova-plugin-camera
cordova plugin add cordova-plugin-file

2. 配置相机参数调用相册/相机 #

设置关键参数保证获取原始图片，避免压缩或裁剪：

navigator.camera.getPicture(onSuccess, onFail, {
  quality: 100, // 最高质量，不压缩图片
  destinationType: Camera.DestinationType.FILE_URI,
  sourceType: Camera.PictureSourceType.PHOTOLIBRARY, // 从相册选图，替换为CAMERA可切换为拍照
  allowEdit: false, // 禁用编辑，防止图片被裁剪
  correctOrientation: true, // 修正图片方向但不改变原始尺寸
  saveToPhotoAlbum: false // 根据需求决定是否保存到相册
});

3. 获取图片的原始属性 #

在成功回调中，通过文件插件获取格式、大小，借助Image对象获取尺寸：

function onSuccess(imageURI) {
  // 解析文件URI获取文件信息
  window.resolveLocalFileSystemURL(imageURI, function(fileEntry) {
    fileEntry.file(function(file) {
      // 输出文件基本属性
      console.log('原始格式(MIME):', file.type);
      console.log('文件大小:', file.size + ' bytes');
      console.log('文件名:', file.name);

      // 获取原始尺寸
      const img = new Image();
      img.onload = function() {
        console.log('原始宽度:', this.width);
        console.log('原始高度:', this.height);
        // 此处可进行图片上传、展示等后续操作
      };
      img.src = imageURI;
    }, err => console.log('文件读取失败:', err));
  }, err => console.log('URI解析失败:', err));
}

function onFail(msg) {
  console.log('获取图片失败:', msg);
}

关键说明 #

• quality:100是保证图片不被压缩的核心参数，若设为低于100的值，图片会被自动压缩
• allowEdit:false必须设置，否则部分平台会启动图片编辑界面，导致返回裁剪后的小图
• 图片的宽高无法通过File对象直接获取，必须借助前端Image对象加载后读取

内容的提问来源于stack exchange，提问作者Gleb