国外课栈 - 跨学科知识视角栈

JavaScript和Python发送文件

 二维码 11
文章附图

本教程将帮助您创建一个基本的工作程序,以将HTML /网页中的任何文件发送到您的服务器上。

我们将使用HTML,JavaScript和Python创建此程序。

文件结构

“文件上载器”是主项目文件夹。在其中,我们有2个文件夹(静态和模板)和一个Python文件app.py

HTML

在HTML网页中,我们创建了一种表单。该表单具有一个输入字段和一个按钮以发送文件。

单击按钮时,我们将调用JavaScript文件“ app.js”中的函数“ uploadFile”。在函数参数中,我们正在传递完整的表格。

我们提到的name是输入字段(在这种情况下,name=“ static_file”)将与我们在Python服务器中收到的参数相同。

JavaScript

在函数的开头,我们创建了一个新的“ FormData”对象,并传递了从HTML接收到的“表单”。

之后,我们创建了一个新的XMLHttpRequest对象,即oReq。使用该对象,我们会将表单数据发送到Python服务器。

在此语句中,我们提到了服务器的请求类型和路由。

Python

上面的代码为我们创建了一个Python服务器。我们有2条路线。

一种是默认的“ /”路由,它返回我们的“ index.html”文件。 另一个路由是“ / upload_static_file”,它从JavaScript接收发布请求和我们的文件。

  1. request.files =>它将为我们提供由javascript表单传递的数据。

  1. f.save(f.filename)=>它将文件保存在当前目录中。

就这样。仅3个代码文件即可将任何文档/音频/视频发送到服务器。

转到主文件夹并使用语句python app.py运行app.py文件。 您可能必须安装诸如flask,flask-cors之类的依赖项。

服务器将像这样启动。

转到浏览器并输入127.0.0.1:5000/。它会打到您的python的默认路由“ /”,并显示HTML页面。

选择一个文件,然后单击上载按钮。您会收到通知“已上传!”

阅读完整文档