Question

我想将文件/照片上传到服务器，但$cordovaFile显示错误：

TypeError：$ cordovaFile.uploadFile不是函数

我使用以下命令安装了ngCordova和插件：

cordova plugin add cordova-plugin-file-transfer

这是我的控制器

app.controller("MainController", function($scope, $state, $http, $ionicModal, $timeout, $ionicModal, $window, $ionicLoading, $location, $sessionStorage, $localStorage, $cordovaCamera, $cordovaFile){

这是我的上传功能

$scope.uploadMoment = function() {
        $ionicLoading.show({
          template: '<p>Mengupload ...</p><ion-spinner icon="android"></ion-spinner>'
        });

        var options = {
            fileKey: "photo",
            fileName: "photo.jpg",
            httpMethod: "post",
            chunkedMode: "false",
            mimeType: "image/jpeg"
        };
$cordovaFile.uploadFile("http://maballo.net/demo/mahafutsal/api/uploadMoment.php",$scope.pictureUrl,options)
            .then(function(result){
                alert('Success: ' + JSON.strigify(result.response));
                $ionicLoading.hide();
            }, function(error){
                alert('Erro: ' + JSON.strigify(error));
                $ionicLoading.hide();
            });
        }

这是我的php文件，我已经用html测试它并且它工作但是当我使用离子测试它时无法重载

<?php
   header('Access-Control-Allow-Origin: *'); 
    $target_dir = "upload/";
    $target_file = $target_dir . basename($_FILES["photo"]["name"]);
    $uploadOk = 1;
    $imageFileType = pathinfo($target_file,PATHINFO_EXTENSION);
    // Check if image file is a actual image or fake image
    if(isset($_POST["submit"])) {
        $check = getimagesize($_FILES["photo"]["tmp_name"]);
        if($check !== false) {
            echo "File is an image - " . $check["mime"] . ".";
            $uploadOk = 1;
            if (move_uploaded_file($_FILES["photo"]["tmp_name"], $target_file)) {
                echo "The file ". basename( $_FILES["photo"]["name"]). " has been uploaded.";
            } else {
                echo "Sorry, there was an error uploading your file.";
            }
        } else {
            echo "File is not an image.";
            $uploadOk = 0;
        }
    }
?>

Answer 1

您需要使用$cordovaFileTransfer上传文件。

您的代码最终应该看起来像这样：

app.controller("MainController", function($scope, $state, $http, $ionicModal, $timeout, $ionicModal, $window, $ionicLoading, $location, $sessionStorage, $localStorage, $cordovaCamera, $cordovaFile, $cordovaFileTransfer){

    $scope.uploadMoment = function() {
        var options = {
            fileKey: "avatar",
            fileName: "image.png",
            chunkedMode: false,
            mimeType: "image/png"
        };
        $cordovaFileTransfer.upload("http://maballo.net/demo/mahafutsal/api/uploadMoment.php", $scope.pictureUrl, options)
            .then(function(result) {
                alert('Success: ' + JSON.strigify(result.response));
                $ionicLoading.hide();
            }, function(error) {
                alert('Erro: ' + JSON.strigify(error));
                $ionicLoading.hide();
            }, function (progress) {
                // constant progress updates
            });
    }

});

Answer 2

.upload方法是$cordovaFileTransfer服务的一部分，而不是$cordovaFile。将$cordovaFile.upload()替换为$cordovaFileTransfer.upload()

$cordovaFileTransfer.upload("http://maballo.net/demo/mahafutsal/api/uploadMoment.php", $scope.pictureUrl, options)
        .then(function(result) {
            alert('Success: ' + JSON.strigify(result.response));
            $ionicLoading.hide();
        }, function(error) {
            alert('Erro: ' + JSON.strigify(error));
            $ionicLoading.hide();
        }, function (progress) {
            // constant progress updates
        });

有关详细信息，请参阅http://ngcordova.com/docs/plugins/fileTransfer/

另外，请确保已将ngcordova.js文件和ngCordova模块添加为应用模块的依赖项

TypeError：$ cordovaFile.uploadFile不是函数

2 个答案: