liyqiang

方式一:

通过form表单提交到后台

前段:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form action="/upload/" method="post" enctype="multipart/form-data">
        <input type="file" name="fafafa">
        <input type="submit">
    </form>
</body>
</html>

Django 后端:

def upload(request):
    if request.method == \'POST\':# 获取对象
        obj = request.FILES.get(\'fafafa\')
        import os
    # 上传文件的文件名
    print(obj.name) f = open(os.path.join(BASE_DIR, \'static\', \'pic\', obj.name), \'wb\') for chunk in obj.chunks(): f.write(chunk) f.close() return HttpResponse(\'OK\') return render(request, \'upload/upload.html\')

 方式二:

通过ajax提交

前段

<div>
        <input type="file" name="file" id="file_upload">
        <input type="button" value="上传" onclick="FileUpload()">
</div>

JS:

<script src="/static/js/jquery-3.2.1.min.js"></script>
<script>
    function FileUpload() {
            var form_data = new FormData();
            var file_info =$( \'#file_upload\')[0].files[0];
            form_data.append(\'file\',file_info);
            //if(file_info==undefined)暂且不许要判断是否有附件
                //alert(\'你没有选择任何文件\');
                //return false
            $.ajax({
                url:\'/upload_ajax/\',
                type:\'POST\',
                data: form_data,
                processData: false,  // tell jquery not to process the data
                contentType: false, // tell jquery not to set contentType
                success: function(callback) {

                    console.log(\'ok\')
                }
            });

            }</script>

Django 后端:

def upload_ajax(request):
    if request.method == \'POST\':
        file_obj = request.FILES.get(\'file\')
        import os
        f = open(os.path.join(BASE_DIR, \'static\', \'pic\', file_obj.name), \'wb\')
        print(file_obj,type(file_obj))
        for chunk in file_obj.chunks():
            f.write(chunk)
        f.close()
        print(\'11111\')
        return HttpResponse(\'OK\')

注意:

前台发送ajax请求时:

processData: false,  // tell jquery not to process the data
contentType: false, // tell jquery not to set contentType
必须设置

方式三:
通过iframe标签提交
前段
   <div>
        <form id="my_form" name="form" action="/upload_iframe/" method="POST" enctype="multipart/form-data">
            <input type="text" name="user">
            <input type="password" name="password">
            <input type="file" name="file">
            <input type="button" value="upload"  onclick="UploadFile()">
        </form>
        <iframe id=\'my_iframe\' name=\'my_iframe\' src="" class="hide"></iframe>
    </div>

JS:

    function UploadFile() {
        document.getElementById(\'my_iframe\').onload = Testt;
        document.getElementById(\'my_form\').target = \'my_iframe\';
        document.getElementById(\'my_form\').submit();
    }
    function Testt(ths){
            var t = $("#my_iframe").contents().find("body").text();
            console.log(t);
        }

Django 后端:

def upload_iframe(request):
    if request.method == \'POST\':
        print(request.POST.get(\'user\', None))
        print(request.POST.get(\'password\', None))
        file_obj = request.FILES.get(\'file\')
        import os
        f = open(os.path.join(BASE_DIR, \'static\', \'pic\', file_obj.name), \'wb\')
        print(file_obj,type(file_obj))
        for chunk in file_obj.chunks():
            f.write(chunk)
        f.close()
        print(\'11111\')
        return HttpResponse(\'OK\')

以上是文件上传的三种方式,在Tornado种也可以使用。

扩展:

在前段提交的时候 可以存在 checkbox 标签, 在Django中对于这种标签在后台获取值时用:

  request.POST.getlist(\'favor\', None) checkbox

其它

request.POST.get(\'favor\', None)  checkbox


 



 

分类:

技术点:

相关文章: