带有子域配置的损坏的 django-debug-toolbar 面板

Question

我正在处理djangoproject.com 网站，并在此dev settings 中配置了Django Debug Toolbar。

我在 djanoproject.com 的 issue #796 中报告了 django-debug-toolbar 的一个问题，但经过一些测试，我认为这只是一个配置问题，我们需要帮助来解决它。

以下所有语句都与本地使用的分支master上的代码有关。

Django Debug Toolbar 适用于 www ，例如，如果我打开 http://www.djangoproject.dev:8000/ 我可以显示工具栏并打开 SQL 面板。

如果我尝试打开例如 http://docs.djangoproject.dev:8000/en/1.11/，我可以看到工具栏，但如果我尝试打开 SQL 面板，我会看到 0: error

这是我在浏览器控制台上看到的消息：

加载失败 http://www.djangoproject.dev:8000/debug/render_panel/?store_id=212b2bb5adc54a3a81b97b6da5547d4c&panel_id=SQLPanel: 请求中不存在“Access-Control-Allow-Origin”标头 资源。原点 'http://docs.djangoproject.dev:8000' 因此不是 允许访问。

直接打开url可以看到所有数据：

http://www.djangoproject.dev:8000/debug/render_panel/?store_id=212b2bb5adc54a3a81b97b6da5547d4c&panel_id=SQLPanel

我认为问题在于工具栏试图为面板打开 www. 而不是 docs. url，但我不知道如何更新解决此问题的设置。

您能否向我们建议代码来修复此错误并在不同的三级域中使用django-debug-toolbar 面板，如docs.djangoproject.com？

Answer 1

在我的 PR 与此解决方案的答案合并到 djangoproject.com 代码中后，我想编写解决方案，以便一些用户可以找到类似问题的解决方案。

这是@jezdez issue 的回答，它解释了这个问题：

简而言之：这是一个 CORS 错误，因为它试图在不允许请求的不同子域上使用 Javascript 请求资源。
debug_toolbar 渲染的 URL 自动使用 www 子域的原因是因为 djangoproject 项目安装了 django-hosts hosts_override 功能，该功能会自动覆盖 Django 内置的 url 模板标签，使用能够解析 Django 的标签URL 作为完全限定的 URL 而不仅仅是 URL 路径。
host_url 模板标签现在在使用 url 模板标签时也被调用，将回退到使用由 DEFAULT_HOST 设置定义的主机，在我们的例子中是 www。 由于我们不能轻易覆盖调试工具栏模板中对 url 标记的调用以传入不同的主机（例如文档），因此基本上只有一个其他选项：设置适当的 CORS 标头 Access-Control-Allow-Origin 以允许在 docs 子域下加载的页面，用于访问 www 子域下的资源。我强烈建议这样做，不要弄乱 URL 生成。也就是说，这应该只应用于开发环境，以减少生产中滥用的机会。
实际上，设置 CORS 标头就像编写一个手动完成的非常小的中间件一样简单。无需使用 django-cors-headers 之类的成熟应用。

我用一个仅限本地的 middelware 解决了这个问题，它设置了 CORS 'Access-Control-Allow-Origin' 标头以允许调试。

class CORSMiddleware(object):
    """
    Set the CORS 'Access-Control-Allow-Origin' header to allow the debug
    toolbar to work on the docs domain.
    """
    def __init__(self, get_response):
        self.get_response = get_response

    def __call__(self, request):
        response = self.get_response(request)
        response['Access-Control-Allow-Origin'] = '*'
        return response

这是合并后的commit，实际上是在工作。