我是python flask的新手,我在后端使用flask,在前端对js和pymongo进行反应,用于数据库。我想将文件从ReactJs上传到flask服务器,执行第二种方法时出现错误,我该怎么办。下面是我尝试过的代码。
我试过两个例子,一个正在工作,另一个不是我不知道为什么。
werkzeug.exceptions.BadRequestKeyError: 400 Bad Request: The browser (or proxy) sent a request that this server could not understand.
KeyError: 'file'
直接将文件发送到API。情况1
Python代码
import os
from flask import Flask, flash, request, redirect, url_for
from werkzeug.utils import secure_filename
UPLOAD_FOLDER = '/path/to/the/uploads'
ALLOWED_EXTENSIONS = set([ 'png', 'jpg', 'jpeg'])
app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
@app.route('/api/users/add_photo', methods=['POST', "GET"])
def upload_file():
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 and allowed_file(file.filename):
filename = secure_filename(file.filename)
file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
image = upload(open(filename, 'rb'))
user_id = user.insert({"file":image})
return jsonify({'result': "file Upload successfully!!!"})
onSubmitImage(e) {
let file = this.state.file;
let formData = new FormData();
formData.append("file", file);
this.props.imageUpload(formData);
}
上面的例子运行良好
将文件发送到对象中的API。情况二
Python代码
import os
from flask import Flask, flash, request, redirect, url_for
from werkzeug.utils import secure_filename
UPLOAD_FOLDER = '/path/to/the/uploads'
ALLOWED_EXTENSIONS = set([ 'png', 'jpg', 'jpeg'])
app = Flask(__name__)
app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
@app.route('/api/users/add_photo', methods=['POST', "GET"])
def upload_file():
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']
name = request.get_json(force=True)["name"]
last_name = request.get_json(force=True)["last_name"]
email = request.get_json(force=True)["email"]
# 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 and allowed_file(file.filename):
filename = secure_filename(file.filename)
file.save(os.path.join(app.config['UPLOAD_FOLDER'], filename))
image = upload(open(filename, 'rb'))
user_id = user.insert({"file":image,"name":name,"last_name":last_name,"email":email})
return jsonify({'result': "file Upload successfully!!!"})
onSubmitImage(e) {
let file = this.state.file;
let formData = new FormData();
formData.append("file", file);
const data = {
file: formData
name: this.state.name
last_name: this.state.last_name
email: this.state.last_name
};
this.props.imageUpload(data);
}
我不知道为什么第一个有效,第二个无效。我想实现第二个示例,因为还有其他数据,例如名称,last_name,带有图像文件的电子邮件。
参考方案
您需要将数据添加到FormData()-即
let file = this.state.file;
let formData = new FormData();
formData.append("file", file);
formData.append("name", this.state.name);
formData.append("last_name", this.state.last_name)
formData.append("email", this.state.last_name)
this.props.imageUpload(formData);
如何在没有for循环的情况下在Javascript中使用Django模板标签 - javascript我想在JavaScript中使用模板变量:我的问题是在javascript代码中使用for循环,for循环之间的所有事情都会重复..但我不想要....下面粘贴了我的代码..有人可以告诉我更好的方法吗这..因为这看起来很丑..这是我的代码: {% block extra_javascript %} <script src="/static/js…
打印二维阵列 - javascript我正在尝试打印子元素。在this example之后。怎么做?。$myarray = array("DO"=>array('IDEAS','BRANDS','CREATIVE','CAMPAIGNS'), "JOCKEY"=>a…
使用JS和PHP更改弹出窗口背景图像 - javascript我有一个JS函数:function zoom(now) { document.getElementById("popup").style.display = "block"; document.getElementById("photos").style.backgroundImage = …
变更事件时道具无法正常工作 - javascript我有一些代码,当用户从下拉列表中选择一个项目时,这会触发一个change事件,然后调用php页面进行处理。首次加载页面时,我选择一个项目,并在触发change事件时,这应更改所选select输入的占位符并禁用相同的输入:“#box_ffrtv”。但是,发生的事情是更改仅在我在下拉菜单中进行了第二选择之后才发生,然后更改了占位符并禁用了输入。我对jquery还…
使用Selenium和python在textBox中快速编写 - javascript我正在使用Selenium和Python(Chorme驱动程序)在文本框中编写内容,但是有很多文本框,我需要它来更快地填充它们。我使用一系列driver.find_element_by_xpath("//input[@class='string required' and @id='order_billing_name…