Flask入门之上传文件到服务器的方法示例

下面我将为你详细讲解如何将文件上传到服务器的方法，并以Flask框架为例，分成两条示例说明：

示例一：使用表单上传文件

首先，在Flask应用程序中导入request模块，该模块可以帮助读取上传的文件并保存到服务器上。

from flask import Flask, request
import os

创建一个表单，允许用户上传文件，并通过POST方法将数据发送到服务器上。

<!DOCTYPE html>
<html>
   <head>
      <title>文件上传示例</title>
   </head>

   <body>
      <form action = "http://localhost:5000/upload" method = "POST" 
         enctype = "multipart/form-data">
         <input type = "file" name = "file" />
         <input type = "submit"/>
      </form>
   </body>
</html>

在Flask应用程序中编写接受文件上传的代码，将上传的文件保存到服务器路径中，然后返回上传成功的消息。

app = Flask(__name__)

@app.route('/upload', methods = ['POST'])
def upload_file():
   file = request.files['file']
   filename = file.filename
   basedir = os.path.abspath(os.path.dirname(__file__))
   file.save(os.path.join(basedir, filename))
   return '文件上传成功！'

if __name__ == '__main__':
   app.run(debug = True)

将以上代码保存到app.py文件中，并在终端中执行python app.py命令启动服务。然后在浏览器中输入http://localhost:5000/，就可以看到一个允许上传文件的表单。

示例二：使用AJAX上传文件

修改表单代码，添加id属性和onsubmit事件，以及一个隐藏的iframe。input元素中的id属性、form属性和target属性均与iframe元素中的id属性相对应。在表单上传事件submit()中使用FormData对象来创建一个新的表单数据对象，将文件数据添加到其中，然后通过XMLHttpRequest对象将表单数据异步上传到服务器上。上传成功后，页面不需要跳转，在iframe中显示上传的结果。

<!DOCTYPE html>
<html>
   <head>
      <title>文件上传示例</title>
      <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
      <script type="text/javascript">
         $(function(){
            $("#uploadForm").submit(function(){
               var formData = new FormData($(this)[0]);
               $.ajax({
                  url: '/upload',
                  type: 'POST',
                  data: formData,
                  async: false,
                  cache: false,
                  contentType: false,
                  processData: false,
                  success: function (data) {
                     $("#result").text(data);
                  },
                  error: function(){
                     alert("文件上传失败！");
                  }
               });
               return false;
            });
         });
      </script>
   </head>

   <body>
      <form id="uploadForm" action="/upload" method="post" enctype="multipart/form-data"
         target="uploadTarget" onsubmit="$('#result').html('文件上传中...')">
         <input type="file" name="file" id="file" />
         <input type="submit" value="上传" id="submit"/>
         <iframe id="uploadTarget" name="uploadTarget" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
      </form>
      <div id="result"></div>
   </body>
</html>

在Flask应用程序中编写接受文件上传的代码，然后返回上传成功的消息。

app = Flask(__name__)

@app.route('/upload', methods = ['POST'])
def upload_file():
   file = request.files['file']
   filename = file.filename
   basedir = os.path.abspath(os.path.dirname(__file__))
   file.save(os.path.join(basedir, filename))
   return '文件上传成功！'

if __name__ == '__main__':
   app.run(debug = True)

将以上代码保存到app.py文件中，并在终端中执行python app.py命令启动服务。然后在浏览器中输入http://localhost:5000/，就可以看到一个允许上传文件的表单。在示例二中，上传过程是通过AJAX实现的，上传成功后不需要跳转页面，可以在指定的div中显示上传结果。

本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：Flask入门之上传文件到服务器的方法示例 - Python技术站