我如何从HTML加载图像到Flask?

Question

我有一个HTML页面，可以让您上传图片并显示它(非常简单)。但是，我如何将特定加载的图像发送到我的flask应用程序中，以便我可以使用python的openCV或PIL包对其执行一些图像处理?

Answer 1

免责声明

我最近做了类似的事情，它可能不是一个100%的解决方案，但使用这部分代码可能会解决你所有的问题。

<标题>

瓶代码这部分获取所有从浏览器上传的文件，并使用相应的扩展名保存。

if request.method=="PUT":
for f in request.files.getlist("Files"): #<---- note 1
f.save(os.path.join(Path_To_Folder, f.filename)) 
return jsonify({"result": "res"}), 200 #status code is only thing important here

<标题>

HTML这只允许你从设备中选择文件

<input type="file" id="file_loader" multiple/>

<标题>JavaScript h1>

const file_loader = document.getElementById("file_loader");
file_loader.onchange = async function(e){   
alert("Upload started")
let sending = new FormData(); //creates form data object
//this for loop adds all files you selected to a form object
for (let i = 0; i < file_loader.files.length; i++) {        
sending.append("Files", file_loader.files[i]);   //<---- note 1 
}
//this part just sends all the files to server
const podaci = await fetch(url_filesistem, {
method: "PUT",
body: sending,        
})
.then((response) => response.json())
.then((pod) => {return pod;}); 

//removing all selected files from an input, so every time you want to select files
//its just those files, not ones previously selected
while (file_loader.length > 0) {
file_loader.pop();
} 
alert("Finnished uploading")    
}

<标题>

注1字符串"Files"为了使此方法工作，两行中提到的内容需要相同。

<标题>

建议首先将所有文件保存在服务器上，然后再进行处理。我不知道什么&;f&;对象，因此我不知道你是否可以立即处理它们。

关于我的代码，请随时问我任何问题!

致以最亲切的问候!