基于Django+Bootstrap框架，设计微型小说网站

网友投稿 928 2022-05-29

JS代码：

$(document).ready( function() { $("#input-b8").fileinput({    rtl: true,    uploadUrl: '/file_receive/',    dropZoneEnabled: false,    showPreview: false,    allowedFileExtensions: ['txt'],    initialPreviewConfig: [] }); });

代码说明：

fileinput（）方法里面传入的是一个json数据，里面有很多个属性，每个数值代表初始化上传控件时的特性，如果没有设置的属性则按照控件的默认属性设置。简单说下里面几个属性的设置：uploadUrl:上传文件地址；dropZoneEnabled:是否显示拖曳区域；showPreview：是否显示预览区域；allowedFileExtensions：允许上传的文件格式。

后台代码

def file_receive(request):     #   接收File-Input空间传送的文件     if request.method == 'POST':         file = request.FILES['input-b8']         file_path = "static/books/"+file.name        with open(file_path,"wb") as f:            for chunk in file.chunks():                 f.write(chunk)    return JsonResponse({'status':'success'})

代码说明：

以上是后台接收文件对象并且保存的代码。我这边省略判断上传文件大小的方法，感兴趣的可以在with open()中添加判断。最后接收文件后，会返回给前端一个json数据，前端插件接收到返回的JSON数据才会确定是否上传文件成功，bootstrap Fileinput才会先Done状态。

拓展：

这里有点需要注意的就是，后台接收上传的文件，虽然是通过POST的方式上传，但是不能通过request.POST["filename"]或者request.POST.get("filename","None")两种方式来访问。

而是需要用另外一种方式：

request.FILES["filename"]或者request.FILES.get("filename","None")

接下来已经得到文件对象，需要把在内存中的文件写入到硬盘中。读取文件的几个方法和属性：

filename.read()：从文件读取整个上传的数据，这个方法只适合小文件

filename.chunks()：按块返回文件，通过for循环进行迭代，可以将大文件按块写入到服务器中

filename.multiple_chunks():当filename文件大于2.5M时，该方法返回True，否则返回False。可以根据该方法来判断选择用1方法还是2方法。

4.2、异步更新已上传的文件列表

HTML代码：

                          上传书籍             上传时间             文件大小             操作                  {% for book in objects %}                     {{ book.name}}             {{ book.book_time }}             {{ book.book_size }}             阅读             删除                  {% endfor %}