django ajax上传文件

后端

def csapi(request):
   if request.method == "POST":
        file_object = request.FILES.get('files') # 这个files就是前面ajax的那个key,我一开始搞错了,获取不到文件名
        file_name = file_object.name
        with open(f'upload/{file_name}', 'wb') as new_file:
            for chunk in file_object.chunks():
                new_file.write(chunk)


    

        return JsonResponse({"code": 'ok'})

前端

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>python项目部署</title>
    <link rel="stylesheet" href="https://ajiho.gitee.io/bootstrap-admin/lib/bootstrap-icons/font/bootstrap-icons.css">
    <link rel="stylesheet" href="https://ajiho.gitee.io/bootstrap-admin/static/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://ajiho.gitee.io/bootstrap-admin/static/css/bootstrap-admin.min.css">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<div class="card text-center border-0 shadow-sm">
    <div class="card-body">
        
        <p class="card-text">
            
        </p>
      
    </div>
</div>
<body>
   
<div class="card text-center border-0 shadow-sm">
    <div class="card-body">
        <h5 class="card-title">这里上传你的项目</h5>
        <p class="card-text">
            <td><input type="file" name="upload" id="file_uploads" required/></td>
            <td><input class="btn btn-primary" type="button" onclick="uploads()" value="上传提交" ></td>
        </p>
        
    </div>
</div>



<script>
    function uploads() {
    const form_data = new FormData();
    form_data.append('files',$('#file_uploads')[0].files[0]);
    $.ajax({
        url:'/csapi/',
        type:'post',
        contentType:false,
        processData:false,
        data:form_data,
        success: function(callback) {
            alert('上传完成!')
        }
    })
}

</script>

</body>
</html>

 

请登录后发表评论

    没有回复内容