Django Ckeditor image browser not finding images

So I’m building a simple blog to keep track of my projects. I decided to use CKeditor as the wysiwyg editor. I was able to get all of it to work except for the image portion of it. I’m not able to view the images in the server when I hit “image browse”, and whenever I upload an image, it does upload but I can’t view it. It pops up as a red ‘X’.

Link to screenshots showing what’s happening: http://imgur.com/a/ODk8p

Below is the code I have where I added CKEditor to my installed apps my project’s settings.py

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

Later in my project’s settings.py I have the setup for CKEditor:

MEDIA_ROOT = os.environ.get('MEDIA_ROOT',os.path.join(BASE_DIR, 'media'))
MEDIA_URL = '/media/'

CKEDITOR_UPLOAD_PATH   = "uploads/"
CKEDITOR_UPLOAD_SLUGIFY_FILENAME = False
CKEDITOR_RESTRICT_BY_USER = True
CKEDITOR_JQUERY_URL = 'http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'
CKEDITOR_CONFIGS = {
    'default': {
        'removePlugins': 'stylesheetparser',
        'toolbar': 'Full',
        'height': 500,
        'width': 900,
    },
}

Here is my models.py for my project (looking very simple for now):

from django.db import models
from ckeditor.fields import RichTextField

class Project(models.Model):
    title = models.CharField(max_length=300)
    banner = models.ImageField(upload_to='banners/')
    body = RichTextField(config_name='default')
    version = models.CharField(max_length=140)

    def __str__():
        return self.title

I also have this line to add CKEditor url in my project’s urls.py:

url(r'^ckeditor/', include('ckeditor.urls')),

Any idea as to might be wrong? Everything works except for the images. Any Help is strongly appreciated

Answer

If this is in DEBUG/runserver mode, did you remember to add

from django.conf import settings
from django.contrib.staticfiles.urls import staticfiles_urlpatterns

if settings.DEBUG:
    urlpatterns += patterns(
        '',
        url(
            r'^media/(?P<path>.*)$',
            'django.views.static.serve', {
                'document_root': settings.MEDIA_ROOT,
            }
        ),
    )

urlpatterns += staticfiles_urlpatterns()

to your urls.py