Fatal编程技术网
  • javascript/
  • Javascript 使用Django提供随机图像

Javascript 使用Django提供随机图像

javascript python django

Javascript 使用Django提供随机图像,javascript,python,django,Javascript,Python,Django,我有大约10万张图片，我的目标是生成一个Django支持的网页，在每次加载页面时随机显示其中一张图片（实际上有点复杂，但这是我的最小示例）。我现在的做法如下： 我将所有100.000个文件放入我的应用程序的静态文件夹中 我手动生成一个包含所有图像路径的数据库 URL关联视图随机选择数据库条目（即路径）并从模板生成页面 我的视图模板如下所示： ... <body> <H1>'Hello World' from the template!</H1> Here's

我有大约10万张图片，我的目标是生成一个Django支持的网页，在每次加载页面时随机显示其中一张图片（实际上有点复杂，但这是我的最小示例）。我现在的做法如下：

  • 我将所有100.000个文件放入我的应用程序的静态文件夹中
  • 我手动生成一个包含所有图像路径的数据库
  • URL关联视图随机选择数据库条目（即路径）并从模板生成页面
    • 我的视图模板如下所示：

    ...
<body>
<H1>'Hello World' from the template!</H1>
Here's a random image: "{{rImage}}"<p>
<canvas class="stream" id="canvas" style="z-index: 1; outline: 1px solid red;" width=505px height=336px></canvas>
<script>
var canvas = document.getElementById("canvas");
var cxt = canvas.getContext("2d");

img = new Image();
img.onload = function(){};
img.src = "/static/rim/{{rImage}}";

cxt.drawImage(img,0,0,canvas.width,canvas.height);
</script>
</body>
...
    虽然这确实有效，但我很确定我违反了一些基本的设计原则。以这种方式为静态图像提供服务是一种良好的做法吗？或者我应该直接将整个图像（而不仅仅是路径）添加到数据库中，例如，使用ImageField？正确的方法是什么？

    正如评论的那样，
    ImageField
    实际上并不在数据库中存储图像，它在文件系统中有指向图像的链接，并生成适当的图像url，以便在模板中使用

    您可以使用
    rImage=Images.objects.order_by（“？”）[0]
    获取随机图像，但请记住，根据您使用的数据库后端（例如mysql），这可能会非常昂贵且操作缓慢。然后，您可以将图像对象传递给模板并使用
    {{rImage.image\u field.url}
    （图像字段为您处理url生成，只需在项目设置中设置适当的值）

    ImageField
    实际上并不在数据库中存储图像，而是图像的路径以及其他信息。请参阅，将图像作为文件系统中的文件提供是正确的方法（决不要将图像作为二进制blob存储在数据库中，以获得相对强大的决不定义）。一个目录中的100000个文件可能会变得不可管理，因此可能需要将其拆分以保持您的正常状态。在这个小示例中，在canavas中绘制图像似乎很奇怪，但我猜您有“真正的需要”。您可以通过使用
    rImage=Images.objects.order_by（'？'）[0].relativeUrl
    来减小DB查询的大小。谢谢！我原以为
    ImageField
    仅用于运行时的文件上载，但我已经有了图像，所以我无法理解
    uploadTo
    参数的意义。另外，我不确定使用静态图像并以动态方式显示它们是否可以。我是否可以确保浏览器不会试图缓存所有100.000个文件，因为他认为这些文件都是正确显示页面所必需的？ 
    def index(request):
    rImage = Images.objects.all()[random.randint(0, 100000)].relativeUrl
    template = loader.get_template('rim/index.html')
    context = RequestContext(request,{'rImage':rImage})
    return HttpResponse(template.render(context))