Img路径在Django中不起作用

Question

我有一个带静态文件的django项目，如截图所示。我注意到许多图像没有加载。以ipads.png为例。索引视图中的HTML是：

            <div class="col-lg-5 col-lg-offset-2 col-sm-6">
                <img class="img-responsive" src="static/img/ipad.png" alt="" />
            </div>

我觉得没问题。但是当我看到萤火虫时，我看到了：

[09/Dec/2014 14:37:35] "GET /static/css/landing-page.css HTTP/1.1" 304 0
[09/Dec/2014 14:37:35] "GET /static/font-awesome-4.2.0/css/font-awesome.min.css HTTP/1.1" 304 0
[09/Dec/2014 14:37:35] "GET /static/css/bootstrap.min.css HTTP/1.1" 304 0
[09/Dec/2014 14:37:35] "GET /index/js/jquery.js HTTP/1.1" 200 14287
[09/Dec/2014 14:37:35] "GET /index/js/bootstrap.min.js HTTP/1.1" 200 14287
[09/Dec/2014 14:37:35] "GET /index/static/img/ipad.png HTTP/1.1" 200 14287
[09/Dec/2014 14:37:35] "GET /index/static/img/dog.png HTTP/1.1" 200 14287
[09/Dec/2014 14:37:35] "GET /static/img/intro-bg.jpg HTTP/1.1" 304 0

我的settings.py是：

import os    

def replace(path):
    assert isinstance(path, str)
    return path.replace('\\', os.sep)    


def here(*args):
    return replace(os.path.abspath(os.path.join(os.path.dirname(__file__), *args)))    


BASE_DIR = here('..')    


def root(*args):
    return replace(os.path.abspath(os.path.join(BASE_DIR, *args)))    

STATICFILES_DIRS = (root('static'),)    


# SECURITY WARNING: don't run with debug turned on in production!
DEBUG = True    

TEMPLATE_DEBUG = True    

ALLOWED_HOSTS = []    


# Application definition    

INSTALLED_APPS = (
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'app1',
)    

MIDDLEWARE_CLASSES = (
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',
    'django.middleware.clickjacking.XFrameOptionsMiddleware',
)    

ROOT_URLCONF = 's3.urls'    

WSGI_APPLICATION = 's3.wsgi.application'    


# Database
# https://docs.djangoproject.com/en/1.6/ref/settings/#databases    

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.sqlite3',
        'NAME': os.path.join(BASE_DIR, 'db.sqlite3'),
    }
}    

# Internationalization
# https://docs.djangoproject.com/en/1.6/topics/i18n/    

LANGUAGE_CODE = 'en-us'    

TIME_ZONE = 'UTC'    

USE_I18N = True    

USE_L10N = True    

USE_TZ = True    


# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.6/howto/static-files/    

STATIC_URL = '/static/'    



# STATIC_ROOT = os.path.join(BASE_DIR, 'static')    


TEMPLATE_DIRS = (
    os.path.join(BASE_DIR,  'templates'),
)

我做错了什么，我该如何解决这个问题？

Answer 1

由于templates和statics位于同一目录中，您需要在路径的前面添加根目录：

src="../static/img/ipad.png" 

Answer 2

也许更好的方法是使用Django的模板语言如下：

<img class="img-responsive" src="{% static img/ipad.png %}" alt="" />

在您的settings.py：

中

SETTINGS_DIR = os.path.dirname(__file__)
PROJECT_PATH = os.path.join(SETTINGS_DIR, os.pardir)
PROJECT_PATH = os.path.abspath(PROJECT_PATH)

STATIC_PATH = os.path.join(PROJECT_PATH, 'static')
STATIC_URL = '/static/'

STATICFILES_DIRS = (
  STATIC_PATH,
)