Django实现社交媒体首页 展示关注用户发布的帖子

核心逻辑是在首页视图中查询当前登录用户所有关注对象发布的帖子，按发布时间倒序返回给模板渲染即可，步骤如下：

1. 修改首页视图（views.py） #

给dashboard视图加上登录校验装饰器，补充关注流查询逻辑，替换原有空的dashboard函数：

@login_required
def dashboard(request):
    # 获取当前登录用户的个人资料
    current_user_profile = request.user.profile
    # 取出当前用户关注的所有用户列表
    followed_users = current_user_profile.following.all()
    # 查询关注用户发布的所有帖子，按发布时间从新到旧排序
    # 如果需要把自己发布的帖子也展示在首页，可以把下一行替换成注释中的写法
    feed_posts = Image.objects.filter(user__in=followed_users).order_by('-created')
    # feed_posts = Image.objects.filter(user__in=list(followed_users) + [request.user]).order_by('-created')
    
    context = {
        'feed_posts': feed_posts
    }
    return render(request,'socialapp/dashboard.html',context)

2. 修改首页模板（dashboard.html） #

删除模板中调试用的user_id、profile_id输出代码，在导航栏、功能链接下方添加帖子流渲染代码：

{% load static %}
{% block content %}
<link rel="stylesheet" href="{% static 'socialapp/dashboard.css' %}">
<div class="nav">
    <div class="navbar">
        <h1 id="logo">SocialNetwork</h1>
        <form method="GET" action="{% url 'search' %}">
            <input type="text" placeholder="搜索用户" name="username"/>
            <input type="submit" value="搜索">
        </form>
        <img  class="profile-photo" src="{{user.profile.photo.url}}" height="50px" width="50px">
        <a id="username" href="{% url 'profile' request.user.username %}"><h3 id="username">{{request.user.username}}</h3></a>
        <a id="username" href="{% url 'logout' %}">退出登录</a>
    </div>
</div>
<hr color="black">

<div class="action-links">
    <a href="{% url 'password_change' %}">修改密码</a>
    <a href="{% url 'edit' %}">编辑资料</a>
    <a href="{% url 'images' %}">发布新帖子</a>
</div>

<!-- 关注流帖子区域 -->
<div class="feed-wrapper">
    {% if feed_posts %}
        {% for post in feed_posts %}
        <div class="post-card" style="border: 1px solid #eee; border-radius: 8px; padding: 15px; margin: 20px 0; max-width: 600px;">
            <div class="post-header" style="display: flex; align-items: center; gap: 10px; margin-bottom: 10px;">
                <img src="{{ post.user.profile.photo.url }}" style="border-radius: 50%; object-fit: cover;" height="40" width="40">
                <a href="{% url 'profile' post.user.username %}" style="font-weight: bold; text-decoration: none; color: #000;">{{ post.user.username }}</a>
                <span style="color: #999; margin-left: auto;">{{ post.created|date:"Y年m月d日" }}</span>
            </div>
            <img src="{{ post.image.url }}" style="width: 100%; border-radius: 4px;" alt="用户帖子">
            {% if post.description %}
            <p style="margin: 10px 0;">{{ post.description }}</p>
            {% endif %}
            <div style="color: #666;">
                点赞数：{{ post.users_like.count }}
            </div>
        </div>
        {% endfor %}
    {% else %}
        <p style="text-align: center; margin-top: 50px; color: #666;">
            暂无内容，快去<a href="{% url 'search' %}" style="color: #1877f2;">搜索感兴趣的用户</a>关注吧
        </p>
    {% endif %}
</div>
{% endblock %}

可选优化 #

• 如果帖子数量较多，可以引入Django内置的Paginator分页组件，避免一次性加载所有帖子造成页面卡顿
• 可以给帖子增加点赞、评论的交互按钮，完善社交功能
• 可以给帖子流增加缓存，降低数据库查询压力

内容的提问来源于stack exchange，提问作者shafquet Naghmi