使用Flask

时间:2018-08-10 11:20:30

标签: python flask

我正在尝试从前端上传文件

servece.ts

pushFileToStorage(file: File): Observable<HttpEvent<{}>> {
const formdata: FormData = new FormData();

formdata.append('file', file);

const req = new HttpRequest('POST', 'http://localhost:8080/upload', formdata, {
  reportProgress: true,
  responseType: 'text'
});

return this.http.request(req);
}

我创建了一个带有flask的Web服务来保存文件,这强烈遵循了官方的flask示例:

import os
from flask import Flask, request, redirect, url_for, send_from_directory
from werkzeug.utils import secure_filename

UPLOAD_FOLDER = '/upload/'
ALLOWED_EXTENSIONS = {'pcap'}

app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER

def allowed_file(filename):
return '.' in filename and \
       filename.rsplit('.', 1)[1] in ALLOWED_EXTENSIONS

@app.route('/upload', methods=['POST'])
def upload_file():
print(request.files)
# check if the post request has the file part
if 'file' not in request.files:
    print('no file in request')
    return""
file = request.files['file']
if file.filename == '':
    print('no selected file')
    return""
if file and allowed_file(file.filename):
    print("hello")
    filename = secure_filename(file.filename)
    file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
    return ""
print("end")
return""

结果-没有例外,也没有文件上传 尝试通过Angular HttpClient处理上传时,flask在请求中未检测到文件

 127.0.0.1 - - [10/Aug/2018 13:46:25] "OPTIONS /upload HTTP/1.1" 200 -

file-upload.html

    <div *ngIf="currentFileUpload" class="progress">
  <div class="progress-bar progress-bar-info progress-bar-striped" role="progressbar" attr.aria-valuenow="{{progress.percentage}}"
    aria-valuemin="0" aria-valuemax="100" [ngStyle]="{width:progress.percentage+'%'}">
    {{progress.percentage}}%</div>
</div>

<label class="btn btn-default">
  <input type="file" (change)="selectFile($event)" accept=".pcap">
</label>

<button class="btn btn-success" [disabled]="!selectedFiles" (click)="upload()">Upload</button>

upload.component.ts

upload() {
    this.progress.percentage = 0;

    this.currentFileUpload = this.selectedFiles.item(0);
    this.uploadService.pushFileToStorage(this.currentFileUpload).subscribe(event => {
      if (event.type === HttpEventType.UploadProgress) {
        this.progress.percentage = Math.round(100 * event.loaded / event.total);
      } else if (event instanceof HttpResponse) {
        console.log('File is completely uploaded!');
      }
    });

    this.selectedFiles = undefined;
  }

我没有问题是什么?

0 个答案:

没有答案