Come e dove salvare i file caricati con ng-flow?

Question

Prima di tutto, io uso ng-flow (file HTML5 estensione caricati su angular.js quadro)

I miei file vengono caricati, accedo l'evento in consolle. Ma non capisco dove e come salvarli.

Ecco il mio codice html, viene chiamato il caricamento.

<div flow-init flow-files-submitted="$flow.upload()"> 
<div class="drop" flow-drop ng-class="dropClass"> 
    <span class="btn btn-default" flow-btn>Upload File</span> 
    <span class="btn btn-default" flow-btn flow-directory ng-show="$flow.supportDirectory">Upload Folder</span> 
    <b>OR</b> 
    Drag And Drop your file here 
</div> 

Ecco il mio config

app.config(['flowFactoryProvider', function (flowFactoryProvider) { 
    flowFactoryProvider.defaults = { 
    target: 'upload.php', 
    permanentErrors: [404, 500, 501], 
    maxChunkRetries: 1, 
    chunkRetryInterval: 5000, 
    simultaneousUploads: 4, 
    singleFile: true 
    }; 
    flowFactoryProvider.on('catchAll', function (event) { 
    console.log('catchAll', arguments); 
    }); 
    // Can be used with different implementations of Flow.js 
    // flowFactoryProvider.factory = fustyFlowFactory; 
}]); 

upload.php si chiama, e $_GET è pieno con i dati,

<script>alert('alert' + array(8) { 
    ["flowChunkNumber"]=> 
    string(1) "1" 
    ["flowChunkSize"]=> 
    string(7) "1048576" 
    ["flowCurrentChunkSize"]=> 
    string(6) "807855" 
    ["flowTotalSize"]=> 
    string(6) "807855" 
    ["flowIdentifier"]=> 
    string(11) "807855-3png" 
    ["flowFilename"]=> 
    string(5) "3.png" 
    ["flowRelativePath"]=> 
    string(5) "3.png" 
    ["flowTotalChunks"]=> 
    string(1) "1" 
} 
)</script> 

ma quando sono qui quello che devo fare per salvare il mio File?

Ho provato a fare move_uploaded_file() su flowFilename e flowRelativePath ma non aggiungere nulla.

Sono nuovo di js.

Grazie.

Answer 1

Guardate l'esempio di script upload.php:

https://github.com/flowjs/flow.js/blob/master/samples/Backend%20on%20PHP.md

// init the destination file (format <filename.ext>.part<#chunk> 
// the file is stored in a temporary directory 
$temp_dir = 'temp/'.$_POST['flowIdentifier']; 
$dest_file = $temp_dir.'/'.$_POST['flowFilename'].'.part'.$_POST['flowChunkNumber']; 

Answer 2

Dopo aver caricato l'immagine con flow.js, una nuova richiesta di messaggio viene inviato al server. È necessario gestire questa richiesta POST e manipolare il file in seguito.

Se si utilizza Java + Spring MVC sarebbe sembra

@RequestMapping(value = "/upload", 
     method = RequestMethod.POST, 
     produces = MediaType.APPLICATION_JSON_VALUE) 
public void handleFileUpload(@RequestParam("file") MultipartFile file) { 
    log.debug("REST request to handleFileUpload"); 
    try { 
     BufferedOutputStream stream = 
       new BufferedOutputStream(new FileOutputStream(new File(path + file.getName()))); 
     stream.write(file.getBytes()); 
     stream.close(); 
     log.debug("You successfully uploaded " + file.getName() + "!"); 
    } catch (IOException e) { 
     e.printStackTrace(); 
    } 
} 

Answer 3

Ho appena trascorso una mezza giornata di lavoro con ng-flow e voluto pubblicare la soluzione a questo per PHP. Non sfrutta la funzionalità chunking e resume, avevo solo bisogno di qualcosa che potesse essere caricato senza un aggiornamento della pagina.

In primo luogo, flow-init = "{target: '/ upload', testChunks: true}" Esempio

<div flow-init="{target: '/upload', testChunks:false}" flow-files-submitted="$flow.upload()" flow-file-success="$file.msg = $message"> 
      <input type="file" flow-btn /> 
      <span flow-btn>Upload File</span> 
</div> 

In secondo luogo,

Ora dovrebbe inviare una richiesta a "/ upload "..... in quella richiesta esiste un array $ _FILES.

una riga di codice salvato il file per me:

$result=move_uploaded_file($_FILES['file']['tmp_name'],'yourfilename'); 

---

Se stai cercando di controllare questo attraverso il controller angolare, è possibile impostare i valori in questo modo:

$scope.uploader={}; 
    $scope.upload = function (id) { 

     $scope.uploader.flow.opts.testChunks=false; 
     $scope.uploader.flow.opts.target='/upload; 
     $scope.uploader.flow.upload(); 
    } 

e nel tuo codice html:

<div flow-init flow-name="uploader.flow"> 
<button flow-btn>Add files</button> 
<div> 

Don

Answer 4

Creare una cartella denominata caricamenti significa dove sono stati spostati i file temporanei qui, quindi aggiungere il codice nello script php.

$uploads_dir = 'uploads'; 
$target_file = $uploads_dir .'/'. basename($_FILES['file']['name']); 
move_uploaded_file($_FILES['file']['tmp_name'],$target_file);