Django框架之动静态网页

Django框架之动静态网页:

静态文件:
	前端已经写好了的,能够直接调用使用的文件
    	# 比如: 网站写好的js文件
        		网站写好的css文件
        		网站用到的图片文件
        		第三方前端框架
        
 # django默认是不会自动帮你创建static文件夹,需要自己手动创建
# 这样做的目的:为了解耦合,更加的方便管理

故我们在搭建Django项目的时候通常情况下:
我们将html文件默认都放到在templates文件夹下
我们将网站所使用的静态文件默认都放在static文件夹下

访问Django主页:

# 报错:因为在后端没有开设一个(http://127.0.0.1:8000/)这个路径所对应的资源接口

访问login/路由:

<h1 class='text-center'>登录</h1>   <!--使文本居中展示-->

我们可以看到,虽然访问到了,但是只识别到了<h1>标签但是,他的样式却没有改变,我们发现是没有访问到css与js静态文件。

# 原因:这是因为我们并没有开设一个可以使用户访问到静态文件的接口
# 那么每次我们在创建路由的时候不可能再把每一个静态文件的接口也配置一下,所以Django就帮助我们来找到这个静态文件。

静态文件配置:

# settings.py

STATIC_URL = '/static/'   # 相当于访问静态文件的令牌,如果想要访问静态文件就必须以static开头


# 配置静态文件
STATICFILES_DIRS = [
    os.path.join(BASE_DIR,'static')  # 这个static相当于真正的static存放静态文件文件夹的路径
    os.path.join(BASE_DIR,'static1'),
    os.path.join(BASE_DIR,'static2'),
]   # 列表的方式说明可存储多个静态文件夹
# html页面:寻找静态文件
    
    <link rel="stylesheet" href="/static/bootstrap-3.4.1-dist/css/bootstrap.min.css">
    <script src="/static/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
# 这个/static/不是静态文件static文件夹路径,这个相当于令牌,如果你的令牌对上了,那么就去STATICFILES_DIRS列表里边的静态文件路径里边找bootstrap-3.4.1-dist/js/bootstrap.min.js,当列表中所有的静态文件路径下的文件都找完还没有才会报错。

# 如果将/static/换成别的我们来看一下:
STATIC_URL = '/xxx/'  

<link rel="stylesheet" href="/static/bootstrap-3.4.1-dist/css/bootstrap.min.css">
<script src="/static/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>

# 如果想要正常访问,那么static就必须改为xxx,因为'令牌'不对只有当令牌对了才会去static文件夹下存放的静态文件查找,这里明显令牌就不对,在令牌这里就会报错。

'''
当我们在写django项目的时候 可能会出现后端代码修改了但是前端页面没有变化的情况
	1.你在同一个端口开了好几个django项目 
		一直在跑的其实是第一个django项目
	
	2.浏览器缓存的问题
	解决:
		settings
			network
				disable cache 勾选上	
	这样就会清除缓存。
'''

静态文件动态解析:

# 如果我们的令牌改了是不是所有html页面用到静态文件路径下的文件都会失效。这样如果我们的html页面很多,就要去每一个静态文件下找到并且修改,那这样无非是非常麻烦不合理的,所有就要用到动态解析,令牌改,html页面的令牌也跟着改。

# 使用方法:
    {% load static %}
    <link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
    <script src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js'%}"></script>
    
# 这样不管静态文件的'令牌'怎样修改,都会自动识别,不需要在手动再去修改静态文件开头
# 注意:这里的开头就必须写为 static(固定语法)
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值