Dosya yüklemeleri için Angular2 sunucu tarafı dinleyicisi

Question

Angular2 CLI projesinde, Vaadin'den this yükleme düğmesinin uygulanmasını sağladım. Düğme UI çalışır, ancak aslında bir dosyayı her yere nasıl yükleyeceğinizi bilmiyorum..

ben dosya yükleme dinler ekspres sunucuya, multer veya düğüm sunucu hakkında çözümler bulma tutmak ve gerçekten nasıl böyle bir sunucu yazmak için hiçbir fikrim yok, nereye koyacakları, nasıl başlamak için , nasıl erişileceği, vb. Dosya yüklemesi kadar önemsiz bir şey elde etmenin daha kolay olması gerektiğini düşündüm, ama öyle değil.

basit bir çözüm nedir?, yan tarafları uygulamak için Angular2'yi yan yana uygulamak için düğmeyi gerçekte bir yere yükleyebilsin, böylece daha sonra indirebilir miyim?

Answer 1

ng2-uploader repo'daki çözümü buldu ve Vaadin Upload ile çalışmak üzere uyarlandı.

component.html

<div *ngIf="newName.valid"> 
      <vaadin-upload 
        target="http://localhost:10050/upload" 
      </vaadin-upload> 
    </div> 

server.js başlangıçta this is an awesome solution test edilmiş ve çalışma çalışan server.js ihtiyacı olanlar için

'use strict'; 

const Hapi  = require('hapi'); 
const Inert  = require('inert'); 
const Md5   = require('md5'); 
const Multiparty = require('multiparty'); 
const fs   = require('fs'); 
const path  = require('path'); 
const server  = new Hapi.Server(); 

server.connection({ port: 10050, routes: { cors: true } }); 
server.register(Inert, (err) => {}); 

const upload = { 
    payload: { 
    maxBytes: 209715200, 
    output: 'stream', 
    parse: false 
    }, 
    handler: (request, reply) => { 
    const form = new Multiparty.Form(); 
    form.parse(request.payload, (err, fields, files) => { 
     if (err) { 
     return reply({status: false, msg: err}); 
     } 

     let responseData = []; 

     files.file.forEach((file) => { 
     let fileData = fs.readFileSync(file.path); 

     const originalName = file.originalFilename; 

     const generatedName = Md5(new Date().toString() + 
      originalName) + path.extname(originalName); 

     const filePath = path.resolve(__dirname, 'uploads', 
      originalName); 

     fs.writeFileSync(filePath, fileData); 
     const data = { 
      originalName: originalName, 
      generatedName: generatedName 
     }; 

     responseData.push(data); 
     }); 

     reply({status: true, data: responseData}); 
    }); 
    } 
}; 

const uploads = { 
    handler: { 
    directory: { 
     path: path.resolve(__dirname, 'uploads') 
    } 
    } 
}; 

server.route([ 
    { method: 'POST', path: '/upload',   config: upload }, 
    { method: 'GET', path: '/uploads/{path*}', config: uploads } 
]); 

server.start(() => { 
    console.log('Upload server running at', server.info.uri); 
}); 

Ve bir bonus.