如何使用 JavaScript 包含 Django 静态 URL？

Question

我有一个 Django 应用程序，用于在数字海洋空间存储静态图像。通过执行以下操作，我可以轻松地在模板中显示这些静态图像：<img>{% static 'images/my_image.png' %}</img>

如果我在加载后检查 HTML 页面，我会看到如下内容：

https://nyc3.digitaloceanspaces.com/nameofmyspace/nameofmyspace-space-static_DEV/images/my_image.png?AWSAccessKeyId=XXXXXXXXXXXXXX&Signature=XXXXXXXXXXXXXXXXXX%3D&Expires=1621600823

但现在我想使用 javascript 动态更改此图像。

所以我试过：

document.getElementById(id+"dynamicImage").src = "{% static 'images/my_image_2.png' %}";

这几乎有效，但图像无法加载。原因是在检查src了 javascript 提供的内容之后：

https://nyc3.digitaloceanspaces.com/nameofmyspace/nameofmyspace-space-static_DEV/images/my_image.png?AWSAccessKeyId=XXXXXXXXXXXXXX&Signature=XXXXXXXXXXXXXXXXXX%3D&Expires=1621600823

你可以看到任何&附加amp;了它的地方。这样做的正确方法是什么？

我可以想到 2 种方法来纠正这个问题，但它们看起来很笨拙。

1. 我可以将 URL 硬编码到 javascript 中，随着事情的变化，这将是一个更新的噩梦
2. 我可以<img id = 'my_image' hidden >{% static 'images/my_image.png' %}</img>对我计划使用的所有链接进行处理，然后在 javascript 中使用let URL = document.getElementById("my_image").innerHTML;. 这将不是一个更新的噩梦，但看起来很笨拙，必须是一个更好的方法。

Answer 1

我通过这样做解决了这个问题：

document.getElementById(id+"dynamicImage").src = ("{% static 'images/my_image_2.png' %}").replace(/&/g, "&");

.replace(/&/g, "&")将全部替换&为&. and是替换所有的正则表达式/。/g