Wagtail 4.1.1：保存BaseSiteSetting模型后重定向至自定义页面

问题背景 #

在Wagtail 4.1.1中，想要实现保存BaseSiteSetting模型后自动重定向到自定义HTML页面，但遇到以下卡点：

• 重写模型save()方法拿不到request对象，无法完成重定向；
• 尝试重写BaseSiteSetting默认模板添加自定义按钮，但除ModelAdmin模板外未生效；
• Wagtail提供的钩子（如after_publish_page）仅支持Page模型，标准Django模型无对应钩子。

相关代码片段：
自定义页面视图：

def sync(request):
    return render(request, "import.html", {"WS_PROTOCOL": settings.WS_PROTOCOL})

Setting模型：

@register_setting
class AnonymousSuccessStoryImportSetting(BaseSiteSetting):
    """
    Setting for importing anonymous success stories.
    """

    file = models.FileField(
       upload_to="success_story_imports/%Y/%m/%d/",
        validators=[validate_file_extension],
        help_text="Upload a CSV file, then click 'Save' afterwards",
        blank=True,
        null=True,
    )
    date = models.DateTimeField(auto_now_add=True)

    class Meta:
        verbose_name = "Importer"

可行解决方案 #

方案1：重写Wagtail的Setting编辑视图（推荐）

Wagtail的Site Settings编辑逻辑由SettingsEditView处理，我们可以继承这个视图，在保存完成后添加重定向逻辑：

1. 创建自定义视图类
   在项目的views.py中添加：

from django.shortcuts import redirect
from wagtail.contrib.settings.views import SettingsEditView
from .models import AnonymousSuccessStoryImportSetting

class CustomSettingEditView(SettingsEditView):
    def form_valid(self, form):
        # 先执行父类的保存逻辑
        response = super().form_valid(form)
        # 判断当前处理的是目标Setting模型
        if self.model == AnonymousSuccessStoryImportSetting:
            # 重定向到自定义sync页面（确保已给该视图配置URL名称'sync'）
            return redirect('sync')
        return response

2. 替换默认的Setting URL配置
   在项目的urls.py中，替换Wagtail默认的settings URL路由，使用自定义视图：

from django.urls import path, include
from wagtail.contrib.settings.views import SettingsListView
from .views import CustomSettingEditView, sync

# 自定义Settings路由，替换编辑视图
custom_settings_urls = [
    path('', SettingsListView.as_view(), name='settings'),
    path('<slug:model_name>/', CustomSettingEditView.as_view(), name='edit'),
]

urlpatterns = [
    # ... 其他已有URL
    # 替换原wagtail settings路由
    path('admin/settings/', include(custom_settings_urls)),
    # 配置自定义sync页面的URL（记得设置name='sync'）
    path('sync/', sync, name='sync'),
]

这样，每次保存AnonymousSuccessStoryImportSetting后，系统会自动重定向到你定义的sync页面。

方案2：前端JS拦截保存事件（依赖模板重写）

如果能成功重写Setting的编辑模板，可以通过JS拦截保存按钮的提交事件，完成保存后跳转：

1. 复制并重写Setting编辑模板
   找到Wagtail默认的setting_edit.html模板（路径通常是wagtail/contrib/templates/wagtailcontrib/settings/setting_edit.html），复制到你项目的templates/wagtailcontrib/settings/目录下。

2. 添加JS跳转逻辑
   在模板的{% block content %}末尾添加：

{% if model_name == 'anonymoussuccessstoryimportsetting' %}
<script>
document.addEventListener('DOMContentLoaded', function() {
    const saveBtn = document.querySelector('button[type="submit"].button--primary');
    if (saveBtn) {
        saveBtn.addEventListener('click', () => {
            // 延迟跳转，确保表单已提交完成
            setTimeout(() => {
                window.location.href = "{% url 'sync' %}";
            }, 500);
        });
    }
});
</script>
{% endif %}

这个方案需要确保模板重写生效，仅对目标Setting模型生效，避免影响其他设置页面。

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