利用Django实现文件上传

一、form表单的形式上传文件

1、路由

urlpatterns = [
    path("upload/", views.UploadView.as_view(),)
]

2、视图

from django.views import View
 
class UploadView(View):
 
    def get(self,reqeust):
        return render(reqeust,"index.html")  #get请求时，返回一个HTML页面
 
    def post(self,reqeust):
        put_file = reqeust.FILES.get("put_file")  #上传文件的post请求时，获取文件内容-->putfile
        print(put_file.name)   #打印文件名
 
        with open(put_file.name,"wb") as f:   #将文件内容写入到文件中保存
            for line in put_file:
                f.write(line)
 
        return HttpResponse("上传成功！")  #返回结果提示

3、模板index.html

<h3>基于form表单的文件上传</h3>
 
<form action="/upload/" method="post" enctype="multipart/form-data">  
    <input type="file" name="put_file">
    <input type="submit">
</form>
 
{#提交文件时，必须设置为这个参数：enctype="multipart/form-data"#}

二、Ajax的形式上传文件

1、后端代码和form表单上传的形式一样

2、前端代码：

<h3>基于Ajax的文件上传</h3>
<div>
    <input type="file" class="put_file">
    <input type="button" value="提交" class="btn">
    <span class="tip"></span>   {# 上传成功后的提示信息显示位置 #}
</div>
 
<script>
    //提交按钮的点击事件
    $(".btn").click(function () {
 
         //定义一个变量formdata，作为要发送的数据
         var formdata =  new FormData();
 
         //将formdata组成键值对的形式，put_file=$(".put_file")[0].files[0],也就是：key=value,value是文件的内容
         formdata.append("put_file",$(".put_file")[0].files[0]);
 
        $.ajax({
            url:"/upload/",
            type:"post",
            data:formdata,   //要发送的数据，为上面准好的 --> formdata
            contentType:false,
            processData:false,
            success:function (res) {
                $(".tip").html(res);  //显示上传成功后的提示信息
            }
        })
    })
</script>