我想在离子应用程序中浏览文件并上传到服务器

时间:2016-06-29 12:11:30

标签: cordova ionic-framework

我只想浏览手机上的文件并将其上传到服务器。文件可以是任何类型。请指导如何操作。

3 个答案:

答案 0 :(得分:0)

您需要使用两个Cordova插件:

  1. File Opener 2 plugin允许用户浏览文件。
  2. File Transfer plugin上传文件。
  3. 有关如何使用File Transfer Cordova插件上传文件的教程:https://www.thepolyglotdeveloper.com/2015/01/upload-files-remote-server-using-ionic-framework/

答案 1 :(得分:0)

我很确定您可以在移动设备上使用基本的HTML文件输入(尚未测试过)

<input type='file' />

它会让您打开以选择从中获取文件的位置(相机,资源管理器)。

我还没有在Ionic上试过这个插件,但它在网络应用程序上效果很好,所以希望它能在Ionic上运行。

https://github.com/valor-software/ng2-file-upload

答案 2 :(得分:0)

allScopes.store('uploadCtrl', $scope);
$scope.filetype = { type:""};
$scope.fileUrl="";
$scope.browsefile = function(){                 
    fileChooser.open(
          `enter code here`function (fileUrl) 
            {               
                window.FilePath.resolveNativePath(fileUrl, function(filePath){
                    $scope.filename = filePath.split('/').pop();
                }, function(err){
                    alert(err);
                });
                $scope.fileUrl = fileUrl;
            },
            function (error) {
                alert(error);
            }
        );

    };  

    $scope.uploadFile = function(){     
        alert($scope.filename);
        var filename = $scope.filename;                     
        var accountid = settings.get().userid;      
        var category = $scope.filetype.type;
        var localuri = $scope.fileUrl;

        if($scope.filetype.type!="")
        {                               
            if(localuri!=null)
            {                                                
                var options = {
                    httpMethod: 'POST',                 
                    chunkedMode: false                  
                };
                $cordovaFileTransfer.upload(configParamUrl+"/bulker/uploadmobilefile?filename="+filename+"&accountId="+accountid+"&category="+category, localuri, options).then(function(result) {                      
                    alert(JSON.stringify(result));
                }, function(err) {                      
                    alert(JSON.stringify(err));
                }, function (progress) {
                    alert(progress.loaded);
                    $scope.uploadProgress = Math.ceil((progress.loaded / progress.total) * 100);
                });            
            }
            else
            {               
                $cordovaToast.show('Choose file to Upload', 'long', 'bottom').then(function(success) {}, function (error) {});
            }               
        }       
        else{
            $cordovaToast.show('Choose file type', 'long', 'bottom').then(function(success) {}, function (error) {});           
        }

    }