目标:通过Django向HTML传送图片展示
我的天哪,真是膈应人,网上的案例都不适合我,感觉所有的解决办法在我这里都不行。
好吧~ 是我菜,看不懂人家的代码,那句话叫啥来着?一本好经被傻和尚念歪了。自己摸索一下午,快疯了。路径是对的,但是就是不能把图片显示出来,最后看到别人博客的一句话,终于出来了~~~ 满满辛酸泪!
进入正题——————假装这是一条分割线————————
上一篇博客说我已经成功将图片上传到Django后台并且成功存储到数据库,接下来就接上一个继续做,将存起来的图片展示到HTML前端上去!
接上一个python项目哈,继续敲······
上一个好像拉掉一个东西了,但是好像也不影响,为什么说不影响,因为我菜!加上吧,免得以后出问题。
在 setting.py 文件中找到 TEMPLATES 中加一句
'django.template.context_processors.media',
总起来说效果是这样子滴
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [os.path.join(BASE_DIR, 'templates')]
,
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
'django.template.context_processors.media',
],
},
},
]
OK,补充完毕!尽管现在我还不知道有啥用。好,开始今天的项目。
在上一个项目代码中添加:
1.在 url.py 文件中添加一条路由,来进入展示界面。就像下面这个样子····
path('show/', views.showimg, name='photos'),
2.在 views.py 文件中创建一个函数,对应我们上一步的路由。
def showimg(request):
imgs = models.mypicture.objects.all() # 查询到数据库所有图片
# 创建一个字典来存储这些图片信息
content = {
'imgs': imgs
}
# 打印一下这些图片信息
for i in imgs:
# 输出一下信息内容
print(i.photo)
# 最后返回一下我们的展示网页,动态图片数据展示放进去
return render(request, 'bbb.html', content)
3.当然,我们也要去修改一下上传图片函数中的代码,让他在上传成功后可以跳转到展示界面
def updateinfo(request):
if request.method == 'POST':
# img = request.FILES.get('photo')
# user = request.FILES.get('photo').name
new_img = models.mypicture(
photo=request.FILES.get('photo'), # 拿到图片
user=request.FILES.get('photo').name # 拿到图片的名字
)
new_img.save() # 保存图片
# 修改的是下面这句代码,重定向到展示记得URL
return redirect('/show/')
return render(request, 'aaa.html')
4. 我们最后创建一个新的HTML文件,用来展示我们之前存进数据库的图片
名字还是随便取了
bbb.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{% for img in imgs %}
<img src="{{MEDIA_URL}}{{ img.photo }}"/>
{% endfor %}
</body>
</html>
我的问题就是出现在下面这句话
<img src="{{MEDIA_URL}}{{ img.photo }}"/>
我试过很多办法,路径格式都正确,就是显示不出图片,要不是白板要不是小×图片,气的要死,各种配置setting.py url.py等都不行,在快要绝望的时候,突然看到一个大神的博客有这样一句话:
福利
当我们在模板(html文件)中引用图片时可以通过下面的方式来轻松获取图片路径:
<img src="{{MEDIA_URL}}/images/logo.png">
结果去试了一下,真他妈行!!!!
附带大神博客:
OK!展示图片也完成了~!~!记录一下,真的很辛苦!
上传的图片是这些:
数据库里面是这个样子滴:
效果图是这个样子滴:
网页源码:
下面是主要代码:
url.py
from django.contrib import admin
from django.urls import path
from app01 import views
from django.conf.urls.static import static
from django.conf import settings
urlpatterns = [
path('admin/', admin.site.urls),
path('up/', views.updateinfo),
path('show/', views.showimg, name='photos'),
# path(r'^media/(?P.*)$', 'django.views.static.serve', {'document_root': settings.MEDIA_ROOT})
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
model.py
from django.db import models
# Create your models here.
class mypicture(models.Model):
user = models.CharField(max_length=64)
photo = models.ImageField(upload_to='photos', default='user1.jpg')
views.py
from django.shortcuts import render, HttpResponse, redirect
from app01 import models
import os
# Create your views here.
from django.core.files.base import ContentFile
def updateinfo(request):
if request.method == 'POST':
# img = request.FILES.get('photo')
# user = request.FILES.get('photo').name
new_img = models.mypicture(
photo=request.FILES.get('photo'), # 拿到图片
user=request.FILES.get('photo').name # 拿到图片的名字
)
new_img.save() # 保存图片
# 修改的是下面这句代码,重定向到展示记得URL
return redirect('/show/')
return render(request, 'aaa.html')
def showimg(request):
imgs = models.mypicture.objects.all() # 查询导数据库所有图片
# 创建一个字典来存储这些图片信息
content = {
'imgs': imgs
}
# 打印一下这些图片信息
for i in imgs:
# 输出一下信息内容
print(i.photo)
# 最后返回一下我们的展示网页,动态图片数据展示放进去
return render(request, 'bbb.html', content)
好,结束!