zoukankan      html  css  js  c++  java
  • django 如何在HMTL中使用媒体media_url

    django 如何在HMTL中使用媒体media_url中指定的路径

    第一种:

    一、

    setting.py里,一般图片或者文件上传路径都是是以下设置,

    MEDIA_URL = '/media/'   #访问路径
    MEDIA_ROOT = os.path.join(BASE_DIR, 'media')  #上传路径

     二、

    项目app里url.py,设置如下

    from django.conf import settings
    from django.views.static import serve
    urlpatterns = [url(r'^media/(?P<path>.*)$', serve, {'document_root': settings.MEDIA_ROOT})]

    三、

    如果想在html中调用media_url的访问路径

    # 首先在setting.py中 TEMPLATES 下面的 'context_processors': 里面添加 'django.template.context_processors.media',
    TEMPLATES = [
    {
    'BACKEND': 'django.template.backends.django.DjangoTemplates',
    'DIRS': [os.path.join(BASE_DIR, 'front/templates')],
    'APP_DIRS': True,
    'OPTIONS': {
    'context_processors': [
    'django.template.context_processors.debug',

    在html中即可如此调用

    <body><img src = "{{ MEDIA_URL }}{{ceshi}}"></body>


    如果没有第三步设置,html中只能使用以下方式调用:

    <img src = "/media/{{ceshi}}">

     第二种:需要django版本>=1.7

    from django.conf import settings
    from django.conf.urls.static import static
    urlpatterns = patterns('',
        # ... the rest of your URLconf goes here ...
    ) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
    
    然后通过添加启用media context_processors inTEMPLATE_CONTEXT_PROCESSORS
    
    TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                #here add your context Processors
                'django.template.context_processors.media',
            ],
        },
    },
    ]
    
    现在每个RequestContext都包含一个变量MEDIA_URL
    现在你可以在你的访问中访问它 template_name.html
    <p><img src="{{ MEDIA_URL }}/image_001.jpeg"/></p>
  • 相关阅读:
    27、BLASTN的参数
    6、R语言绘制带errorbar 的柱状图
    26、HDF5 文件格式简介
    25、转录本(transcript)组成(gtf文件的第三列)
    6、perl创建模块(Exporter)及路径 引用 嵌套 查询模块
    24、嵌合体序列Chimeras
    24、sam- 详解
    22、IDP-ASE
    21 、GPD-PSL-VCF
    EasyUI 中easyui-textbox和easyui-searchbox文本框的点击事件。
  • 原文地址:https://www.cnblogs.com/weilaibuxiangshuo/p/10405944.html
Copyright © 2011-2022 走看看