ios Cordova 1.7.0捕获并上传照片示例

时间:2012-05-17 03:34:50

标签: cordova

我正在尝试连接照片以上传到服务器..没有一个cordova 1.7.0的例子..只是尝试这个但它不起作用。我的错误是.. wait_fences:收不到回复:10004003。

function capturePhoto() {
  // Take picture using device camera and retrieve image as base64-encoded string
  navigator.camera.getPicture(onPhotoDataSuccess, onFail, { quality: 50,
    destinationType: destinationType.DATA_URL });
}


// A button will call this function
//
function getPhoto(source) {
  // Retrieve image file location from specified source
  navigator.camera.getPicture(onPhotoURISuccess, onFail, { quality: 50, 
    destinationType: destinationType.FILE_URI,
    sourceType: source });
}


 function onSuccess(imageData) { 
 var image = document.getElementById('myImage');
 image.src = "data:image/jpeg;base64," + imageData;
 $.post('http://site.com/api/upload.php', {data:imageData});
 }

<?php 

if ($_REQUEST['image']) {

// convert the image data from base64
$imgData = base64_decode($_REQUEST['image']);

// set the image paths
$file = '/api/' . md5(date('Ymdgisu')) . '.jpg';
$url = 'http://www.site.com' . $file; 

// delete the image if it already exists
if (file_exists($file)) { unlink($file); }

// write the imgData to the file
$fp = fopen($file, 'w');
fwrite($fp, $imgData);
fclose($fp);
}

?>

3 个答案:

答案 0 :(得分:1)

try this one if its helpful to you.

$image = $_REQUEST['image'];
$name = date('Ymdgisu') . '.jpg';
base64_decode_image($image, $name);

function base64_decode_image($image, $name){
    if ($image){
        $new_file = fopen("/api/" . $name, "x");
        fwrite($new_file, base64_decode($image));
        fclose($new_file);
        //echo base64_decode($image);
    }
}

答案 1 :(得分:0)

我认为你可以这样使用。

navigator.camera.getPicture(onSuccess, onFail, { quality: 50, destinationType: Camera.DestinationType.DATA_URL });

function onSuccess(imageData) {
//var image = document.getElementById('myImage');
//image.src = "data:image/jpeg;base64," + imageData;
$.post('http://www.site.com/api/upload.php', {data:imageData});
}

function onFail(message) {
alert('Failed because: ' + message);
}

这里onSuccess函数返回你可以传递给upload.php文件的base64编码图像字符串

答案 2 :(得分:0)

使用Cordova的Camera and File Transfer插件编写以下代码上传照片。在iOS上运行,并假设它在PhoneGap / Cordova支持的所有移动浏览器上运行。

Cordova Photo Upload示例:
cordova file transfer plugin not working in ios simulator

Cordova的文件传输插件(https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-file-transfer/index.html)支持二进制(FILE_URI)或base64(DATA_URI)上传。

传统上,文件(如照片)以二进制形式保存到磁盘,然后使用mime类型multipart/form-dataapplication/octet-stream上传到服务器。

在base64中,您的高分辨率照片会保存到浏览器缓存中,这会导致内存溢出,因为浏览器旨在链接到高分辨率图像而不是缓存它们。此外,base64文件比二进制文件大37%左右,所以这对情况也没有帮助。

<强> TL; DR;

  1. 安装Cordova Camera Plugin和Cordova文件传输插件
    > cordova plugin add cordova-plugin-camera --save;
    > cordova plugin add cordova-plugin-file-transfer --save;

  2. 将相机选项设置为FILE_URI

    navigator.camera.getPicture(success, error, {
      destinationType: destinationType.FILE_URI
    });
    
  3. 使用Cordova的传输文件插件上传照片

    var request = new FileTransfer();
    var options = new FileTransferOptions();
    request.upload(fileUri, success, error, options);