Django项目不能加载静态资源的问题,解决办法(上)!

    在做个Django试验的时候发现我直接访问应用下面的静态文件,结果却是返回了200,但是却没有吧静态问题件加载上来,一个都没有;

一直百思不得姐,明明文件都能访问到了,但是为什么不能加载出来,最后还是访问项目下面的静态文件给加载出来的!

我的问题复现:

注:我这里使用的个人博客模板是网上下载杨青的个人博客模板,只做例子使用,有需要的可以直接去她的个人博客上去下载:

https://www.yangqq.com/


这里说明下:我的Django版本是1.8.2的

Python是3.6.3的


图片.png


1、创建项目:
#django-admin startproject myBlogOne
2、进入项目
/myBlogOne$ cd myBlogOne
3、创建应用
/myBlogOne$ py manage.py startapp myAppOne
4、修改配置文件,加载应用
/myBlogOne$ vim myBlogOne/settings.py 

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

5、在最末尾加上静态文件配置
SRARTIC_ROOT = os.path.join(BASE_DIR,'static')
MEDIA_URL= '/media/'
MEDIA_ROOT= os.path.join(BASE_DIR,'static/media')

6、创建静态文件目录
/myBlogOne$ mkdir -pv  myAppOne/static/myAppOne myAppOne/templates/myAppOne static

7、拷贝HTML文件到对应的应用目录下面我们创建的模板目录
/myBlogOne$ cp ~/Downloads/个人博客模板《早安》/*.html myAppOne/templates/myAppOne/
8、拷贝css、js、images文件到应用目录下我们创建的静态文件目录下面
/myBlogOne$ cp -r  ~/Downloads/个人博客模板《早安》/css ~/Downloads/个人博客模板《早安》/js ~/Downloads/个人博客模板《早安》/images  myAppOne/static/myAppOne

9、收集静态文件:
/myBlogOne$ py manage.py collectstatic

图片.png



10、看下收集前和收集后的结果:

    1️⃣收集前的:

图片.png

    2️⃣收集后的:

图片.png

#注:这里为什么要在项目目录下也要创建static目录呢?明明应用目录下已经有了!如果还在项目目录下面在创建一个不是对此一举吗?
#那是因为:应用目录下面的文件夹是为了给迁移的时候传给项目目录下面来调用的,不会使用应用下面的静态文件,
#如果你在HTML文件里面调用了应用下面的静态问价就会发生和我一样的问题,明明加载返回的状态码是200,但是却什么都没有


11、编写视图模块views,让请求的路由找到对应的模块去加载

/myBlogOne$ vim myAppOne/views.py

from django.shortcuts import render

def index(request):
    return render(request,'myAppOne/index.html')

def list1(request):
    return render(request, 'myAppOne/list.html')

def about(request):
    return render(request, 'myAppOne/about.html')

def share(request):
    return render(request, 'myAppOne/share.html')

def info(request):
    return render(request, 'myAppOne/info.html')

def gbook(request):
    return render(request, 'myAppOne/gbook.html')


12、编写路由urls,让我们的请求都可以找到相对应的视图

    1️⃣让总路由去找到,应用的路由,

/myBlogOne$ vim myBlogOne/urls.py

from django.conf.urls import include, url
from django.contrib import admin

urlpatterns = [
    url(r'^admin/', include(admin.site.urls)),
    url(r'^myAppOne/', include('myAppOne.urls')),
]

    2️⃣编写应用的路由模块,让路由找到对应的视图去加载应用

vim myAppOne/urls.py

from django.conf.urls import url
from .views import *

urlpatterns = [
    url(r'^$',index),
    url(r'^/index/$',index),
    url(r'^/about/$',about),
    url(r'^/gbook/$',gbook),
    url(r'^/info/$',info),
    url(r'^/share/$',share),
    url(r'^/list/$',list1),
]


13、启动Django服务

py manage.py runserver

在浏览器上输入

http://127.0.0.1:8000/myAppOne/

如果有编码错误的话会有如下报错:

图片.png


我们需要把我们的index配置文件改为utf-8图片.png



我们再次访问可以再浏览器上看到如下图的展示图片.png



13、到这里重点来了,我们该怎么把我们需要的静态资源加载上来呢 ?这里面都是404错误

    1️⃣首先我们先来查看下html文件这里的静态文件加载有问题,

图片.png

    我们修改为当前应用下面的静态文件具体如下:


图片.png

我们再去访问试试看还会不会报出404错误了,到此我们的试验就算结束了!!













猜你喜欢

转载自blog.51cto.com/853056088/2312311