django - can't see the uploaded media files from apache

1.9k views Asked by At

I have two different directory for both media and static. And as I upload the files through the local server (localhost:8000), I can see the uploaded images both by the local server and the apache server. However, when I upload it with apache(localhost), I can't see them. I can only see the static. But when I reload the page served by the local server (not runserver again), I can then see those pictures both by the local server and the apache. What am I doing wrong? Any help will be appreciated. Thank you.

models.py for uploading file:

def get_upload_file_name(instance, filename):
    return "uploaded_files/%s_%s" %(str(time()).replace('.','_'), filename)

class Status(models.Model):
    status = models.TextField()
    image = models.ImageField(upload_to=get_upload_file_name, blank=True)
    pub_date = models.DateTimeField(default=datetime.now)
    creator = models.ForeignKey(User, related_name="creator_set")
    likes = models.ManyToManyField(User, through="Like")

    class Meta:
        ordering = ['-pub_date']
        verbose_name_plural = ('Status')

    def __unicode__(self):
        return self.status

settings.py:

MEDIA_ROOT = 'C:/Users/Robin/media'

MEDIA_URL = '/media/'

STATIC_ROOT = 'C:/Users/Robin/static/'

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    "C:/Users/Robin/web/leo/static",
)

http.conf:

WSGIScriptAlias / C:/Users/Robin/web/leo/leo/wsgi.py
WSGIPythonPath C:/Users/Robin/web/leo

<Directory C:/Users/Robin/web/leo>
<Files wsgi.py>
Order deny,allow
Allow from all
</Files>
</Directory>

#Alias /robots.txt /path/to/mysite.com/static/robots.txt
#Alias /favicon.ico /path/to/mysite.com/static/favicon.ico

AliasMatch ^/([^/]*\.css) C:/Users/Robin/static/styles/$1

Alias /media/ C:/Users/Robin/media/
Alias /static/ C:/Users/Robin/static/

<Directory C:/Users/Robin/static>
Order deny,allow
Allow from all
</Directory>

<Directory C:/Users/Robin/media>
Order deny,allow
Allow from all
</Directory>

WSGIScriptAlias / C:/Users/Robin/web/leo/leo/wsgi.py

<Directory C:/Users/Robin/web/leo/leo>
<Files wsgi.py>
Order allow,deny
Allow from all
</Files>
</Directory>

urls.py:

from django.conf.urls import patterns, include, url
from django.conf import settings
from django.conf.urls.static import static

from django.contrib import admin
admin.autodiscover()

urlpatterns = patterns('',
    url(r'^$', 'leo.views.home', name='home'),
    url(r'^home/', include('status.urls')),
    url(r'^gallery/$', 'leo.views.gallery'),
    url(r'^mypage/$', 'leo.views.mypage'),

    # Accounts
    url(r'^please_login/$', 'leo.views.please_login'),
    url (r'^accounts/auth_view/$', 'leo.views.auth_view'),
    url (r'accounts/register/$', 'leo.views.register_user'),
    url (r'register_success/$', 'leo.views.register_success'),
    url (r'^accounts/loggedin/$', 'leo.views.loggedin'),
    url (r'^accounts/invalid/$', 'leo.views.invalid_login'),
    url (r'^accounts/logout/$', 'leo.views.logout'),

    url(r'^admin/', include(admin.site.urls)),
) + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

.html:

            {% block content %}
                <div class="status">
                    <div class="inner">
                        {% for Status in status %}
                            <p class="user">{{ Status.creator.get_full_name }}</p>
                            {% if Status.image %}
                                <div class="image_image">
                                    <center>
                                    <img src="{{Status.image |thumbnail_url:'status'}}"/>
                                    </center>
                                </div>
                                <p class="status_image">{{Status}}</p>
                                <span class="clear"></span>
                                <hr>
                            {% else %}
                                <p class="status_status">{{Status}}</p>
                                <span class="clear_right"></span>
                                <hr>
                            {% endif %}
                        {% endfor %}
                    </div>
                </div>
            {% endblock %}

Can't see when uploaded with apache server(localhost): enter image description here

Only when I reload the page served by the django's server(localhost:8000), I can see it on the page served by the apache. enter image description here

1

There are 1 answers

0
Robin On

The images were not loading when uploaded directly from the apache server because of the {% load_thumbnai %} in the index.html file.

Here's the snippet of html file:

{% load static from staticfiles %}
{% load thumbnail %}

<!DOCTYPE html>

<html>
    <head>
        <title>leo</title>
        <link rel="stylesheet" type="text/css" href="{% static "css/style.css" %}">
    </head>
....
....

And here's the other part of it for image:

                        {% for Status in status %}
                            <p class="user">{{ Status.creator.get_full_name }}</p>
                            {% if Status.image %}
                                <div class="image_image">
                                    <center>
                                    <img src="{{Status.image |thumbnail_url:'status'}}"/>
                                    </center>
                                </div>
                                <p class="status_image">{{Status}}</p>
                                <span class="clear"></span>
                                <hr>
                            {% else %}
                                <p class="status_status">{{Status}}</p>
                                <span class="clear_right"></span>
                                <hr>
                            {% endif %}
                        {% endfor %}

After I made these changes, it was OK for me.

{% load static from staticfiles %}

<!DOCTYPE html>

<html>
....
....

And this:

                            <div class="image_image">
                                <center>
                                <img src="{{ MEDIA_URL }}{{Status.image}}" width=300px />
                                </center>
                            </div>

Hope this comes in help for someone!