如何在无脂框架中上传文件？

Question

如何上传fatFramework中的文件。我使用angularjs在fatfree框架中发送post请求。我想使用文件扩展名.jpg和大小2mb，并且只限制4个文件。请指导我。

这里是我的html代码 -

<div class="col-md-9" style="margin-bottom: 40px" ng-controller="AppController" nv-file-drop="" uploader="uploader" filters="queueLimit, customFilter"> 
        <h3> upload</h3> 
        <div ng-show="uploader.isHTML5"> 

         <input type="file" nv-file-select="" uploader="uploader" multiple /><br/> 


         <table class="table"> 
          <tbody> 
           <tr ng-repeat="item in uploader.queue"> 
            <td><strong>{{ item.file.name }}</strong></td> 
            <td ng-show="uploader.isHTML5" nowrap>{{ item.file.size/1024/1024|number:2 }} MB</td> 
            <td ng-show="uploader.isHTML5"> 
             <div class="progress" style="margin-bottom: 0;"> 
              <div class="progress-bar" role="progressbar" ng-style="{ 'width': item.progress + '%' }"></div> 
             </div> 
            </td> 
            <td class="text-center"> 
             <span ng-show="item.isSuccess"><i class="glyphicon glyphicon-ok"></i></span> 
             <span ng-show="item.isCancel"><i class="glyphicon glyphicon-ban-circle"></i></span> 
             <span ng-show="item.isError"><i class="glyphicon glyphicon-remove"></i></span> 
            </td> 
            <td nowrap> 
             <button type="button" class="btn btn-success btn-xs" ng-click="item.upload()" ng-disabled="item.isReady || item.isUploading || item.isSuccess"> 
              <span class="glyphicon glyphicon-upload"></span> Upload 
             </button> 
             <button type="button" class="btn btn-warning btn-xs" ng-click="item.cancel()" ng-disabled="!item.isUploading"> 
              <span class="glyphicon glyphicon-ban-circle"></span> Cancel 
             </button> 
             <button type="button" class="btn btn-danger btn-xs" ng-click="item.remove()"> 
              <span class="glyphicon glyphicon-trash"></span> Remove 
             </button> 
            </td> 
           </tr> 
          </tbody> 
         </table> 
        </div> 

       </div> 

---

这里是我的角度控制器

'use strict'; 

角

.module('app', ['angularFileUpload']) 


.controller('AppController', ['$scope', 'FileUploader', function($scope, FileUploader) { 
    var uploader = $scope.uploader = new FileUploader({ 
     url: 'uploadfile' 
    }); 

    // FILTERS 

    uploader.filters.push({ 
     name: 'customFilter', 
     fn: function(item /*{File|FileLikeObject}*/, options) { 
      return this.queue.length < 10; 
     } 
    }); 


    console.info('uploader', uploader); 
}]); 

这里是我的无脂代码

$f3->route('GET|POST|PUT /uploadfile', 
    function($f3) use($db){ 
    //print_r($f3['BODY']);die; 
    $data = $f3['BODY']; 
    print_r($data); 
    $file_name = $data['filename']; 
    $file = "/ui/uploads"; 
    $file .= $id . "/"; 
    $file .= $file_name; 
    $f3->set('SESSION.id', $file); 
    echo var_dump($file); 

    } 
); 

Answer 1

$f3->route('GET|POST|PUT /uploadfile', 
    function($f3) use($db){ 
    $f3->set('UPLOADS','uploads/'); // don't forget to set an Upload directory, and make it writable! 

     $overwrite = false; // set to true, to overwrite an existing file; Default: false 
     $slug = true; // rename file to filesystem-friendly version 
     $web = \Web::instance(); 
     $files = $web->receive(function($file,$formFieldName){ 
       var_dump($file); 
       /* looks like: 
        array(5) { 
         ["name"] =>  string(19) "csshat_quittung.png" 
         ["type"] =>  string(9) "image/png" 
         ["tmp_name"] => string(14) "/tmp/php2YS85Q" 
         ["error"] => int(0) 
         ["size"] =>  int(172245) 
        } 
       */ 
       // $file['name'] already contains the slugged name now 

       // maybe you want to check the file size 
       if($file['size'] > (2 * 1024 * 1024)) // if bigger than 2 MB 
        return false; // this file is not valid, return false will skip moving it 

       // everything went fine, hurray! 
       return true; // allows the file to be moved from php tmp dir to your defined upload dir 
      }, 
      $overwrite, 
      $slug 
     ); 

     //var_dump($files); 
     //$files will contain all the files uploaded, in your case 1 hence $files[0]; 
     $answer = array('answer' => 'Files transfer completed'); 
     $json = json_encode($answer); 
     echo $json; 

    } 
); 

文件上传通过POST完成（根据您的angularUploadModule） 你可以看到更多在这里：http://fatfreeframework.com/web#receive