Koa.js - Tải lên tệp

Ứng dụng web cần cung cấp chức năng cho phép tải tệp lên. Hãy để chúng tôi xem cách chúng tôi có thể nhận tệp từ máy khách và lưu trữ chúng trên máy chủ của chúng tôi.

Chúng tôi đã sử dụng phần mềm trung gian koa-body để phân tích cú pháp các yêu cầu. Phần mềm trung gian này cũng được sử dụng để xử lý tải lên tệp. Hãy để chúng tôi tạo một biểu mẫu cho phép chúng tôi tải lên các tệp và sau đó lưu các tệp này bằng Koa. Đầu tiên, hãy tạo một mẫu có tênfile_upload.pug với các nội dung sau.

html
   head
      title File uploads
   body
      form(action = "/upload" method = "POST" enctype = "multipart/form-data")
         div
            input(type = "text" name = "name" placeholder = "Name")
         
         div
            input(type = "file" name = "image")
         
         div
            input(type = "submit")

Lưu ý rằng bạn cần cung cấp cùng loại mã hóa như trên trong biểu mẫu của mình. Bây giờ hãy để chúng tôi xử lý dữ liệu này trên máy chủ của chúng tôi.

var koa = require('koa');
var router = require('koa-router');
var bodyParser = require('koa-body');
var app = koa();

//Set up Pug
var Pug = require('koa-pug');
var pug = new Pug({
   viewPath: './views',
   basedir: './views',
   app: app 
});

//Set up body parsing middleware
app.use(bodyParser({
   formidable:{uploadDir: './uploads'},    //This is where the files would come
   multipart: true,
   urlencoded: true
}));

var _ = router(); //Instantiate the router

_.get('/files', renderForm);
_.post('/upload', handleForm);

function * renderForm(){
   this.render('file_upload');
}

function *handleForm(){
   console.log("Files: ", this.request.body.files);
   console.log("Fields: ", this.request.body.fields);
   this.body = "Received your data!"; //This is where the parsed request is stored
}

app.use(_.routes()); 
app.listen(3000);

Khi bạn chạy điều này, bạn sẽ nhận được biểu mẫu sau.

Khi bạn gửi cái này, bảng điều khiển của bạn sẽ tạo ra kết quả sau.

Các tệp đã được tải lên được lưu trữ trong đường dẫn ở đầu ra ở trên. Bạn có thể truy cập các tệp trong yêu cầu bằng cách sử dụngthis.request.body.files và các trường trong yêu cầu đó bởi this.request.body.fields.