ios – 从相机/照片库上传的离子应用图像

我正在开发离线聊天应用程序,用户可以在其中上传照片作为其消息的一部分.我正在寻找一种将图像上传到我的webhost服务器的方式,以便稍后通过URL检索.

问题是我无法让它上​​传到我的网络服务器.

我正在使用这两个插件：

> org.apache.cordova.file-transfer
> cordova插件相机

当我在xcode模拟器中运行应用程序并从设备照片库中选择一个图片时,控制台给我以下消息：

文件传输完成响应码200
> void SendDelegateMessage(NSInvocation *)：等待10秒后,委托(webView：runJavaScriptAlertPanelWithMessage：initiateByFrame :)无法返回.主运行循环模式：kCFRunLoopDefaultMode>
>成功：“”

这是我目前使用的代码：

app.controller('HomeController',function($rootScope,$scope,$cordovaCamera,$ionicActionSheet,$cordovaFileTransfer){ ...

// open PhotoLibrary
    $scope.openPhotoLibrary = function() {
        var options = {
            quality: 100,destinationType: Camera.DestinationType.FILE_URI,sourceType: Camera.PictureSourceType.PHOTOLIBRARY,allowEdit: true,encodingType: Camera.EncodingType.JPEG,popoverOptions: CameraPopoverOptions,saveToPhotoAlbum: false
        };

        $cordovaCamera.getPicture(options).then(function(imageData) {

            //console.log(imageData);
            //console.log(options);

            var url = "http://mydomein.com/upload.php";
            //target path may be local or url
            var targetPath = imageData;
            var filename = targetPath.split("/").pop();
            var options = {
                fileKey: "file",fileName: filename,chunkedMode: false,mimeType: "image/jpg"
            };
            $cordovaFileTransfer.upload(url,targetPath,options).then(function(result) {
                console.log("SUCCESS: " + JSON.stringify(result.response));
                alert("success");
                alert(JSON.stringify(result.response));
            },function(err) {
                console.log("ERROR: " + JSON.stringify(err));
                alert(JSON.stringify(err));
            },function (progress) {
                // constant progress updates
                $timeout(function () {
                    $scope.downloadProgress = (progress.loaded / progress.total) * 100;
                })
            });

        },function(err) {
            // error
            console.log(err);
        });
    }

这是我的upload.php文件：

<?php
// move_uploaded_file($_FILES["file"]["tmp_name"],$cwd . '/files/images/');
move_uploaded_file($_FILES["file"]["tmp_name"],"/files/images");
?>

解决方法

经过一些挖掘,很多的尝试,我终于得到它的工作.

这是我想出的代码：

// open PhotoLibrary
    $scope.openPhotoLibrary = function() {
        var options = {
            quality: 50,saveToPhotoAlbum: false
        };

        $cordovaCamera.getPicture(options).then(function(imageData) {

            //console.log(imageData);
            //console.log(options);   
            var image = document.getElementById('tempImage');
            image.src = imageData;  

            var server = "http://yourdomain.com/upload.php",filePath = imageData;

            var date = new Date();

            var options = {
                fileKey: "file",fileName: imageData.substr(imageData.lastIndexOf('/') + 1),mimeType: "image/jpg"
            };

            $cordovaFileTransfer.upload(server,filePath,options).then(function(result) {
                console.log("SUCCESS: " + JSON.stringify(result.response));
                console.log('Result_' + result.response[0] + '_ending');
                alert("success");
                alert(JSON.stringify(result.response));

            },function(err) {
                console.log("ERROR: " + JSON.stringify(err));
                //alert(JSON.stringify(err));
            },function (progress) {
                // constant progress updates
            });


        },function(err) {
            // error
            console.log(err);
        });
    }

而在域上服务器上的upload.php中的代码：

<?php

// if you want to find the root path of a folder use the line of code below:
//echo $_SERVER['DOCUMENT_ROOT']


if ($_FILES["file"]["error"] > 0){
echo "Error Code: " . $_FILES["file"]["error"] . "<br />";
}
else
{
echo "Uploaded file: " . $_FILES["file"]["name"] . "<br />";
echo "Type: " . $_FILES["file"]["type"] . "<br />";
echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kilobytes<br />";

if (file_exists("/files/".$_FILES["file"]["name"]))
  {
  echo $_FILES["file"]["name"] . " already exists. No joke-- this error is almost <i><b>impossible</b></i> to get. Try again,I bet 1 million dollars it won't ever happen again.";
  }
else
  {
  move_uploaded_file($_FILES["file"]["tmp_name"],"/var/www/vhosts/yourdomain.com/subdomains/domainname/httpdocs/foldername/images/".$_FILES["file"]["name"]);
  echo "Done";
  }
}
?>