django+ajax上传图片,预览并存储到数据库

1、配置url
urls.py中配置地址
django+ajax上传图片,预览并存储到数据库_第1张图片
2、在models.py中创建类

class Pictures(models.Model):
    pic = models.ImageField(upload_to='onlineBug/media')
    def __str__(self):
        return self.pic

3、在views.py中添加如下代码

class UploadForm(forms.Form):
    file = fields.FileField()

# 发来表单 实现上传功能
@csrf_exempt
@require_POST
def upload(request):
    if request.method == 'POST':
        try:
            # f1 = UploadForm(request.POST, request.FILES)
            # f1 = request.FILES.get('formData')
            f1 = request.FILES.getlist('file')
            for img in f1:
                random_name = str(int(random.random()*10000000000000000))
                img_name = img.name.split('.')
                print(img_name)
                if len(img_name) == 2:
                    print("img_name[0]:%s"%img_name[0])
                    new_img_name = img_name[0] + random_name + '.' +img_name[1]
                else:
                    new_img_name=''
                    for i in range(len(img_name)-1):
                        new_img_name += img_name[i]
                    new_img_name = new_img_name + random_name +'.'+ img_name[len(img_name)-1]
                print("new_img_name:%s"%new_img_name)
                print("进入for循环")
                # 利用模型类将图片要存放的路径存到数据库中
                print("img:%s"%img)
                p = Pictures()
                p.pic = 'onlineBug\\static\\onlineBug\\media\\'+ new_img_name
                print("p.pic:%s"%p.pic)
                p.save()
                # 在之前配好的静态文件目录static/media/onlineBug 下 新建一个空文件
                # 然后我们循环把上传的图片写入到新建文件当中
                fname = settings.MEDIA_ROOT+ "\\" + new_img_name
                print("fname:%s"%fname)
                with open(fname,'wb') as pic:
                    for c in img.chunks():
                        pic.write(c)
            return HttpResponse('1')
        except:
            return HttpResponse('2')
    else:
        return render(request, 'onlineBug/upload.html')

4、upload.html文件



{% load staticfiles %}

    
    Title
    
    
    
    
    
    
    
    
    
    
 



请上传多张照片

注:每张照片大写不可超过4M,且最多可以传十张

+

点击上传

{##} {##} {##}

5、运行
django+ajax上传图片,预览并存储到数据库_第2张图片

你可能感兴趣的:(Django)