title: Django | joined path is located outside of the base path component {% static img.thumbnail.url %}, Error 400 with whitenoise
body: <p>I've finish my first app in Django and works perfectly, but still have pre-deployment problems since I set DEGUG=False ...
  Here is just to display an image in a template... T_T</p>
  
  <p>I was using this, but now it does'nt work when I use whitenoise to serve my image localy... And it return a Bad Request(400) error... </p>
  
  <h3>Models.py</h3>
  
  <pre><code>class GalleryItem(models.Model):
      thumbnail = models.ImageField(blank=True,upload_to='gallery/thumb')
      img_wide = models.ImageField(blank=True,upload_to='gallery')
  </code></pre>
  
  <h3>template.py</h3>
  
  <pre><code>{% load staticfiles %}
  {% for img in img_to_display %}
      &lt;a href="{{ img.img_wide.url}}" class="swipebox" title=""&gt;
          &lt;img src="{% static img.thumbnail.url %}" alt="{{ img.alt}}"&gt;
      &lt;/a&gt;
  {% endfor %}
  </code></pre>
  
  <h3>urls.py</h3>
  
  <pre><code>from django.conf.urls import url, include
  from django.contrib import admin
  from django.conf import settings
  import os
  
  from django.conf import settings
  from django.conf.urls.static import static
  
  urlpatterns = [
      url(r'^gallery/', include('gallery.urls')),
      url(r'^shop/', include('shop.urls')),
      url(r'^events/', include('events.urls')),
      url(r'^page/', include('paginator.urls')),
      url(r'^news/', include('blog.urls')),
      url(r'^ckeditor/', include('ckeditor_uploader.urls')),
      url(r'^admin/', admin.site.urls),
  ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
  </code></pre>
  
  <h3>settings.py</h3>
  
  <pre><code>import os
  import dj_database_url
  
  BASE_DIR = os.path.dirname(os.path.dirname(__file__))
  print("BASE_DIR = ",BASE_DIR)
  MEDIA_ROOT = os.path.join(BASE_DIR, 'wt/static/media/')
  MEDIA_URL = '/media/'
  
  SECRET_KEY = 'SECRET_KEY'
  
  DEBUG = False
  
  INSTALLED_APPS = [
      'ckeditor',
      'ckeditor_uploader',
      'team.apps.TeamConfig',
      'gallery.apps.GalleryConfig',
      'shop.apps.ShopConfig',
      'events.apps.EventsConfig',
      'blog.apps.BlogConfig',
      'paginator.apps.paginatorConfig',
      'django.contrib.admin',
      'django.contrib.auth',
      'django.contrib.contenttypes',
      'django.contrib.sessions',
      'django.contrib.messages',
      'django.contrib.staticfiles',
  ]
  
  MIDDLEWARE_CLASSES = [
      'django.middleware.security.SecurityMiddleware',
      'django.contrib.sessions.middleware.SessionMiddleware',
      'django.middleware.common.CommonMiddleware',
      'django.middleware.csrf.CsrfViewMiddleware',
      'django.contrib.auth.middleware.AuthenticationMiddleware',
      'django.contrib.auth.middleware.SessionAuthenticationMiddleware',
      'django.contrib.messages.middleware.MessageMiddleware',
      'whitenoise.middleware.WhiteNoiseMiddleware',
  ]
  
  ROOT_URLCONF = 'wt.urls'
  
  TEMPLATES = [
      {
          'BACKEND': 'django.template.backends.django.DjangoTemplates',
          'DIRS': [os.path.join(BASE_DIR, 'templates')],
          'APP_DIRS': True,
          'OPTIONS': {
              'context_processors': [
                  "django.contrib.auth.context_processors.auth",
                  "django.core.context_processors.request",
                  "django.core.context_processors.debug",
                  "django.core.context_processors.i18n",
                  "django.core.context_processors.media",
                  "django.core.context_processors.static",
                  "django.core.context_processors.tz",
                  "django.contrib.messages.context_processors.messages",
              ],
          },
      },
  ]
  
  WSGI_APPLICATION = 'wt.wsgi.application'
  
  DATABASES = {
      'default': {
          'ENGINE': 'django.db.backends.postgresql',
          'NAME': 'wt_db',
          'USER': 'postgres',
          'PASSWORD': 'PASSWORD',
          'HOST': '127.0.0.1',
          'PORT': '5432',
      }
  }
  
  
  AUTH_PASSWORD_VALIDATORS = [
      {
          'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
      },
      {
          'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
      },
      {
          'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
      },
      {
          'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
      },
  ]
  
  LANGUAGE_CODE = 'fr-fr'
  TIME_ZONE = 'UTC'
  USE_I18N = True
  USE_L10N = True
  USE_TZ = True
  
  db_from_env = dj_database_url.config(conn_max_age=500)
  DATABASES['default'].update(db_from_env)
  
  
  ALLOWED_HOSTS = ['localhost', '127.0.0.1',]
  
  STATIC_ROOT = os.path.join(BASE_DIR, 'wt/staticfiles')
  STATIC_URL = '/static/'
  
  STATICFILES_DIRS = [
      os.path.join(BASE_DIR, 'wt/static'),
      os.path.join(BASE_DIR, 'wt/staticfiles'),
  ]
  
  STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'
  
  CKEDITOR_UPLOAD_PATH = 'uploads'
  CKEDITOR_IMAGE_BACKEND = 'pillow'
  CKEDITOR_BROWSE_SHOW_DIRS = True
  </code></pre>
  
  <h3>Here my error log :</h3>
  
  <pre><code>The joined path (E:\media\gallery\thumb\lost-thumb.jpg) is located outside of the base path component (E:\dev\wt\wt\wt\staticfiles)
  [15/May/2016 20:01:41] "GET /page/gallery HTTP/1.1" 400 26
  </code></pre>
  
  <p>Thanks a lot for helping ! :)</p>
  
  <p>EDIT :</p>
  
  <p><a href="http://i.stack.imgur.com/C9IpW.jpg" rel="noreferrer">principal structure</a></p>
  
  <p><a href="http://i.stack.imgur.com/MXmTt.jpg" rel="noreferrer">project folder</a></p>