更改django中每个用户的网页logo

Question

如何在base.html中更改网站徽标每一个其他用户登录到Django平台?例如:User-A (request.user.customer.public_id)登录时，将自己的logo上传到文件夹后，会在网站上看到不同的logo，而User-B则会看到不同的logo等等。默认情况下，如果没有用户上传徽标，那么他们将在网站上看到默认徽标。

<div class="container-fluid" title="Website">
<a data-testid="linkElement"
href="https://www.google.com" target="_self" class="xQ_iF"><img src="{% static 'logo.png' %}" alt="google"
style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="true" aria-label="Toggle navigation">
</button>
</a>
<nav class="navbar navbar-expand-lg">
<ul class="navbar-nav ml-auto" style = "margin-left: auto;">
<li class="nav-item active">
<a class="nav-link" href="{% url 'home' %}"><i class="fa fa-home"></i>&nbsp; Home <span class="sr-only">(current)</span></a>
</li>

<li class="nav-item active">
<a class="nav-link" href="https://www.google.com/support-page"><i class="fa fa-envelope"></i>&nbsp; Support<span class="sr-only">(current)</span></a>
</li>


<li class="nav-item dropdown">
<a  class="nav-link dropdown-toggle" id="navbarDropdownMenuLink-4" data-bs-toggle="dropdown">
<i class="fa fa-user-circle-o"></i>&nbsp; {{request.user}}</a>
<div class="dropdown-menu" style="background-color: #
</div>
</li>
</ul>
</div>

</div>
</div>
</nav>
</div>

Answer 1

您可以将其绑定到用户本身的数据库结构中。在这种情况下，我建议将图片字段添加到与用户关联的新模型中(或者最好是与用户关联的组):

class UserLogos(models.Model):
"""
Model for storing User Logos
"""
user = models.ForeignKey(
User,
on_delete=models.CASCADE,
verbose_name=_("user"),
help_text=_("The associated user"),
)
photo = models.ImageField(
_("photo"),
upload_to="logo_photos",
help_text=_("Your logo photo"),
default="logo_photos/default.png",
)

然后在视图中调用这个项目:

def index(request):
"""
Index View
Render the server configured index page
"""
return render(
request,
"index.html",
{
"userLogo": models.UserLogos.filter(user=request.user).first()
},
)

最后在你的html模板中:

<img src="{{ userLogo.photo.url }}"/>

Answer 2

假设我们有一个使用dynamic_logo_page.html模板的路由dynamic_logo_page/，对应的视图名称为dynamic_logo_view。

# Inside views.py
def get_logo_url(user_id):
# TODO: implement logic to get the logo_url based on user_id
return some_logo_url
def dynamic_logo_view(request):
if request.user.is_authenticated:
logo_url = get_logo_url(request.user.id)
content = {
"user_id": request.user.id,
"logo_url": logo_url
}

return render(request, 'dynamic_logo_page.html', content)

<!-- Inside dynamic_logo_page.html -->
...
{% if user.is_authenticated %}
<div>Hi {{ user_id }}, here is your personalized logo below:</div>
<img src="{{ logo_url }}" alt='logo'/>
{% endif %}
...

Answer 3

解决方案取决于您是希望在每次请求时向每个用户显示随机徽标，还是每个用户都有自己的特定徽标。

每个用户的随机标识，每个请求不同

如果你想让每个请求的徽标都是随机的，你可以在模板上下文中提供一个徽标列表，然后使用一个随机过滤器从列表中随机选择一个徽标。

<img id="logo" src="{% static logo_options|random %}">

这将导致徽标在统计上可能同时对两个用户相同，但这取决于可用的徽标变体的数量。

每个用户的特定标识，每个请求相同

要为用户提供相同的徽标，则必须指定徽标并以某种方式存储。这可以通过向User模型添加ImageField，然后在模板中检索该字段来实现。

在Django中有多种扩展User模型的方法，参见这里的教程:https://simpleisbetterthancomplex.com/tutorial/2016/07/22/how-to-extend-django-user-model.html

根据您的解决方案，模板最终可能看起来像这样:

<img id="logo" src="{% static user.logo.url %}">

Answer 4

我就是这样解决这个问题的。这是我的models.py

class Customer(models.Model):
user = models.OneToOneField(User, null=True, blank =True, on_delete=models.CASCADE)
date_created = models.DateTimeField(auto_now_add=True, null=True)
name = models.CharField(max_length=200, null=True)
first_name = models.CharField(max_length=200, null=True)
last_name = models.CharField(max_length=200, null=True)
email = models.CharField(max_length=200, unique=True)
phone = models.CharField(max_length=200, null=True)
platformLogo= models.ImageField(upload_to=upload_path, default='logo.png', null=True, blank=False)

这是保存徽标的函数。

def upload_path(instance, filename):
filename = str(date.today())
name = instance.user.customer
name1 = str(name)
name = name1.replace('@','_')
return f'{name}/{filename}.jpg'

我settings.py

STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static")]

MEDIA_URL = '/platformLogo/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'static/platformLogo')

HTML模板

<div class="container-fluid" title="Website">
{% if request.user.is_staff %} 
<a data-testid="linkElement"
href="https://www.google.com" target="_self" class="xQ_iF"><img src="{% static 'logo.png' %}" alt="google"
style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">
{% else %}
<a data-testid="linkElement"
href="https://www.google.com" target="_self" class="xQ_iF"><img src="{% static user.customer.platformLogo.url %}" alt="google"
style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">

{% endif %}
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="true" aria-label="Toggle navigation">
</button>
</a>
<nav class="navbar navbar-expand-lg">
<ul class="navbar-nav ml-auto" style = "margin-left: auto;">
<li class="nav-item active">
<a class="nav-link" href="{% url 'home' %}"><i class="fa fa-home"></i>&nbsp; Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item active">
<a class="nav-link" href="https://www.google.com/support-page"><i class="fa fa-envelope"></i>&nbsp; Support<span class="sr-only">(current)</span></a>
</li>

<li class="nav-item dropdown">
<a  class="nav-link dropdown-toggle" id="navbarDropdownMenuLink-4" data-bs-toggle="dropdown">
<i class="fa fa-user-circle-o"></i>&nbsp; {{request.user}}</a>
<div class="dropdown-menu" style="background-color: #
</div>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>

Answer 5

我找到了另一种解决这个问题的方法。下面是我的models.py文件。

class Customer(models.Model):
user = models.OneToOneField(User, null=True, blank =True, on_delete=models.CASCADE)
date_created = models.DateTimeField(auto_now_add=True, null=True)
name = models.CharField(max_length=200, null=True)
first_name = models.CharField(max_length=200, null=True)
last_name = models.CharField(max_length=200, null=True)
email = models.CharField(max_length=200, unique=True)
phone = models.CharField(max_length=200, null=True)
platformLogoUrl = models.CharField(max_length=500, default='https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Google_2011_logo.png/640px-Google_2011_logo.png', null=True)

HTML模板

<div class="container-fluid" title="Website">
{% if request.user.is_staff %} 
<a href="https://www.google.com" <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3e/Google_2011_logo.png/640px-Google_2011_logo.png" alt="google"
style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">
{% else %}
<a data-testid="linkElement"
href="https://www.google.com"><img src="{{request.user.customer.platformLogoUrl}}" alt="google"
style="width:90px;height:60px; margin-left: auto; margin-right: auto; padding-left: 32px;  position: absolute;">

{% endif %}
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup"
aria-controls="navbarNavAltMarkup" aria-expanded="true" aria-label="Toggle navigation">
</button>
</a>
<nav class="navbar navbar-expand-lg">
<ul class="navbar-nav ml-auto" style = "margin-left: auto;">
<li class="nav-item active">
<a class="nav-link" href="{% url 'home' %}"><i class="fa fa-home"></i>&nbsp; Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item active">
<a class="nav-link" href="https://www.google.com/support-page"><i class="fa fa-envelope"></i>&nbsp; Support<span class="sr-only">(current)</span></a>
</li>

<li class="nav-item dropdown">
<a  class="nav-link dropdown-toggle" id="navbarDropdownMenuLink-4" data-bs-toggle="dropdown">
<i class="fa fa-user-circle-o"></i>&nbsp; {{request.user}}</a>
<div class="dropdown-menu" style="background-color: #
</div>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>