首页 > 解决方案 > 从 Django 后端使用 Javascript 加载多个图像

问题描述

我正在开发一个基于 d3 的可视化工具,该工具允许用户单击图像上的路径。在我尝试让用户通过简单的下拉菜单更改背景图像之前,一切正常。

问题是由于跨域权限,javascript 无法从磁盘加载文件。所以我选择的解决方案是设置一个后端。我选择姜戈。

这是操纵图像的 javascript 代码:

window.LOADED_FILE = "PUT PATH HERE";

我有一个工作下拉列表,用户可以在其中选择图像,然后我得到文件的路径。在此之后,我尝试像下面这样加载图像。

window.SVG.append("image")
        .attr("width", window.WIDTH + "px")
        .attr("height", window.HEIGHT + "px")
        .attr("xlink:href", window.LOADED_FILE);     

这根本不起作用,我只得到 404 请求的占位符图像。所以试图遵循两件事:

  1. 首先,这是我在这里找到的解决方案。这工作正常,但我不想要并且我不能将每个可能的图像硬编码到 HTML 文件中,只是为了在用户想要稍后在用户需要时选择另一个图像时选择正确的变量。所以我需要一个更动态的解决方案。

  2. 在此之后,我尝试了以下. 但是当我这样做时,console.log(DJANGO_STATIC_URL)我会得到一个空日志。在 settings.py 文件中包含以下静态 url:STATIC_URL = '/static/'.

所以我想要的是一个解决方案,说明我应该如何使用 javascript 加载图像,而不是将它们硬编码到 HTML 文件中。我怀疑我误解了某些东西或忽略了一些明显的东西。

标签: javascriptpythondjango

解决方案


{{ STATIC_URL }}"django.template.context_processors.static"仅当您TEMPLATES在 settings.py 中有 context_processors 选项时才在上下文中。


推荐阅读