无需引入完整第三方包的Django博客正文插入图片实现方案咨询

下面分两个实现方向，你可以根据自己的需求选择：

方案1：自定义模板过滤器（匹配你最初的urlize思路） #

这个方案不需要修改后台逻辑，只需要约定正文插入标记规则，用自定义过滤器渲染成图片即可：

• 第一步：新增关联图片模型，用来存储所有文章内嵌的图片

# models.py
from django.db import models

class Post(models.Model):
    title = models.CharField(max_length=200)
    body = models.TextField()
    # 保留其他原有字段...

class PostImage(models.Model):
    post = models.ForeignKey(Post, on_delete=models.CASCADE, related_name="images")
    image = models.ImageField(upload_to="post_inline/")
    alt_text = models.CharField(max_length=100, default="配图")

• 第二步：自定义模板过滤器，解析正文中的图片标记
  首先在你的app目录下新建templatetags文件夹，新增__init__.py空文件，再新建blog_filters.py：

# blog_filters.py
import re
from django import template
from django.utils.html import escape
from yourapp.models import PostImage

register = template.Library()
# 约定标记格式为 [[img:图片ID]]，也可以根据自己的使用习惯调整正则匹配规则
IMG_PATTERN = re.compile(r'\[\[img:(\d+)\]\]')

@register.filter(name='render_inline_imgs')
def render_inline_imgs(value):
    def replace_img(match):
        img_id = match.group(1)
        try:
            img = PostImage.objects.get(id=img_id)
            return f'<img src="{escape(img.image.url)}" alt="{escape(img.alt_text)}" class="inline-post-img">'
        except PostImage.DoesNotExist:
            return '[图片不存在]'
    return IMG_PATTERN.sub(replace_img, value)

• 第三步：模板中使用过滤器渲染正文
  首先在模板顶部加载过滤器：{% load blog_filters %}，然后替换原有正文渲染代码：

{{ post.body | render_inline_imgs | safe }}

注意：如果你的正文允许普通用户输入，建议额外增加XSS过滤逻辑，避免安全风险

方案2：后台轻量插入优化 #

不需要引入完整第三方包，只需要给admin加个小功能即可实现快速插入：

• 给PostAdmin加内联的PostImage上传面板，上传图片后直接显示对应的插入标记[[img:ID]]和一键复制按钮，你只需要把标记粘贴到正文对应位置即可
• 如果需要更便捷的插入效果，可以给admin的正文textarea加100行以内的自定义JS，实现点击图片直接把标记插入到正文光标位置，不需要手动复制粘贴

两个方案加起来代码量不超过200行，完全不需要引入额外第三方依赖，比直接引入全量第三方包更灵活可控，也不会带入不需要的冗余功能。

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