从 Vue 上传文件到 Flask CORS 不起作用

问题描述 投票:0回答:2

我正在尝试将文件从 vue 上传到 Flask,但是我得到了

跨源请求被阻止:同源策略不允许 读取远程资源http://localhost:5000/upload。 (原因:CORS 标头“Access-Control-Allow-Origin”丢失)..

这是我的 vue 代码:

<script>
  var Vue = require('vue');
  Vue.use(require('vue-resource'));
  export default {
    name: 'app',
    methods: {
      onFileChange(e) {
        var files = e.target.files || e.dataTransfer.files;
        if (!files.length)
          return;
        let data = new FormData();
        data.append('file', files[0]);
        Vue.http.post('http://localhost:5000/upload', this.fileUploadFormData, function (data) {
          alert('good')
        });
      }
    }
  }
</script>

这是我的应用程序.py

import os

from flask import Flask, render_template, app, send_file, request, jsonify, flash, redirect, url_for
from livereload import Server
from werkzeug.utils import secure_filename
from pandas import read_csv
from flask_cors import CORS, cross_origin


app = Flask(__name__)
cors = CORS(app, resorces={r'/*': {"origins": '*'}})
app.config['CORS_HEADER'] = 'Content-Type'


UPLOAD_FOLDER = 'static/uploads'
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER


@app.route('/', methods=['GET', 'POST'])
@cross_origin(origin='*', headers=['Content-Type', 'Authorization'])
def upload_file():
    return send_file('static/html/index.html')


@app.route('/upload', methods=['POST'])
@cross_origin(origin='*', headers=['Content-Type', 'Authorization'])
def uploadFile():
    if request.method == 'POST':
        # check if the post request has the file part
        if 'file' not in request.files:
            flash('No file part')
            return redirect(request.url)
        file = request.files['file']
        # if user does not select file, browser also
        # submit a empty part without filename
        if file.filename == '':
            flash('No selected file')
            return redirect(request.url)
        if file:
            filename = secure_filename(file.filename)
            full_filename = os.path.join(app.config['UPLOAD_FOLDER'], filename)
            file.save(full_filename)
            df = read_csv(full_filename, error_bad_lines=False, warn_bad_lines=False)
            return str(df.to_json())
    #return redirect(url_for('upload_file', file=filename))


if __name__ == "__main__":
    app.debug = True
    server = Server(app.wsgi_app)
    #server.serve()
    app.run()
flask cors flask-cors
2个回答
2
投票

在这一行:

cors = CORS(app, resorces={r'/*': {"origins": '*'}})
你有一个错字。将
resorces
更改为
resources


0
投票

添加http 维杜

© www.soinside.com 2019 - 2024. All rights reserved.