1. 前台页面运行在前台服务器上,负责页面的渲染(静态文件的加载)与转跳
2. 后台代码运行在后台服务器上,负责数据的处理(提供数据请求的接口)
1. 前台与后台有跨域问题,解决跨域
安装django-cors-headers模块
在settings.py中配置
# 注册app
INSTALLED_APPS = [
...
'corsheaders'
]
# 添加中间件
MIDDLEWARE = [
...
'corsheaders.middleware.CorsMiddleware'
]
# 允许跨域源
CORS_ORIGIN_ALLOW_ALL = True
2. 前台代码
$.ajax({
url: 'http://127.0.0.1:8731/login/',
type: 'post',
data: {
usr: 'abc',
pwd: '123'
},
success: function (data) {
console.log(data);
// 可以完成页面的局部刷新
}
})
3. 后台代码
def login(request):
# 假设数据库存放的用户信息为 abc:123
if request.method == 'POST':
usr = request.POST.get('usr', None)
pwd = request.POST.get('pwd', None)
if usr == 'abc' and pwd == '123':
return JsonResponse({'status': 'OK', 'usr': usr})
return JsonResponse({'status': 'error', 'usr': None})
浏览器:
<form>
<input class="file" type="file">
<button type="button" class="upload">上传button>
form>
<script>
$('.upload').click(function () {
var form_data = new FormData();
var file = $('.file')[0].files[0];
form_data.append('file', file);
$.ajax({
url: '跨域上传地址',
type: 'post',
data: form_data,
contentType: false, // 不设置内容类型
processData: false, // 不预处理数据
success: function (data) {
console.log(data)
}
})
})
script>
后台:
def upload(request):
file = request.FILES.get('file', None)
if file:
with open(file.name, 'wb') as f:
for line in file:
f.write(line)
return JsonResponse({
'status': 'OK',
'msg': 'upload success'
})
浏览器:
<a href="http://127.0.0.1:8121/download/">下载a>
<button type="button" class="download">下载button>
<script>
$('.download').click(function () {
location.href = 'http://127.0.0.1:8121/download/'
})
script>
后台:
def download(request):
file = open('123.zip', 'rb')
response = FileResponse(file)
response['Content-Type'] = 'application/octet-stream'
response['Content-Disposition'] = 'attachment;filename="%s"' % file.name
return response
什么是cookie:前端浏览器以明文形式存放的具有key、value信息特征的字符串
cookie的作用:在前后台均可以访问并设置cookie,从而解决http协议的无状态特点导致先后两次请求无逻辑可寻问题(如:不同用户登录后,再进入个人主页,明显是有信息区别的)
cookie简介:随着浏览器的发展,很多浏览器不再对cookie个数加以限制,但仍存在大小的限制,一般为4k;但为了达到传输的高效,服务器的解析速度,还是建议开发者严格控制cookie个数
cookie初始:为页面文档document的一个字符串属性:document.cookie = 'key=value;'
# Django用HttpResponse对象操作Cookie
response = HttpResponse('所有的响应都是HttpResponse对象')
# 设置cookie:key、vaule与过期时间
response.set_cookie(key, value, max_age)
# 删除cookie:key
response.delete_cookie(key)
# 设置加盐cookie:key、vaule与盐字符串(就是简易的加密)
response.set_signed_cookie(key, value, salt)
# 通过request对象获取Cookie
# 获取key对应的value
request.COOKIES.get(key, None)
# 获取加盐后的key对应的value
request.get_signed_cookie(key, salt)
'''
了解:set_cookie方法的其他参数
1. expires:过期时间,格式为字符串类型的时间
2. path:作用路径,/代表所有路径下均起作用
3. domain:作用域名
4. secure:布尔类型,浏览器是否通过HTTPS方式回传cookie
5. httponly:布尔类型,JS能否直接访问该条cookie
'''
# 在视图函数中通过request对象操作session
# 1. 设置session
request.session['key1'] = 'value1'
request.session['key2'] = 'value2'
# 过程:
# i) 生成一个随机字符串,作为主键
# ii) 在django_session表中插入有三个字段的一条数据(一条数据对应一个浏览器会话)
-- session_key:主键-随机字符串
-- session_data:该会话拥有的所有key-value形成的大字典的加密字符串
-- expire_date:过去时间,默认14天
# iii) 往浏览器中写入一条cookie,sessionid=主键的随机字符串
# 2. 获取session
request.session.get('key', None)
# 3. 删除session
request.session.delete() # 只删除当前会话对应的一条记录
request.session.flush() # 除了删除当前会话对应的一条记录外,还删除对应浏览器中的cookie,建议使用
# 4. 清除django-session表中所有过期的session字段
request.session.clear_expired() # 情况所有过去的Session
# 5. 了解
request.session.session_key # 获取当前会话对应的session_key
request.session.exists('session_key') # 判断某session_key是否存在
# settings.py配置
# 1. 数据库存储
# SESSION_ENGINE = 'django.contrib.sessions.backends.db' # 引擎(默认)
#
# 2. 缓存存储
# SESSION_ENGINE = 'django.contrib.sessions.backends.cache' # 引擎
# SESSION_CACHE_ALIAS = 'default' # 使用的缓存别名(默认内存缓存,也可以是memcache),此处别名依赖缓存的设置
#
# 3. 文件存储
# SESSION_ENGINE = 'django.contrib.sessions.backends.file' # 引擎
# SESSION_FILE_PATH = '/' # 缓存文件路径,如果为None,则使用tempfile模块获取一个临时地址tempfile.gettempdir()
#
# 4. 缓存 + 数据库存储
# SESSION_ENGINE = 'django.contrib.sessions.backends.cached_db' # 引擎
#
# 5. 加密Cookie
# SESSION_ENGINE = 'django.contrib.sessions.backends.signed_cookies' # 引擎
#
# SESSION_COOKIE_NAME = "sessionid" # cookie的key名,值为随机字符串
# SESSION_COOKIE_PATH = "/" # 作用路径,/代表所有路径下均起作用)
# SESSION_COOKIE_DOMAIN = None # 作用域名
# SESSION_COOKIE_SECURE = False # 布尔类型,浏览器是否通过HTTPS方式回传cookie
# SESSION_COOKIE_HTTPONLY = True # 布尔类型,JS能否直接访问该条cookie
# SESSION_COOKIE_AGE = 1209600 # 数据库session字段的过期时间
# SESSION_EXPIRE_AT_BROWSER_CLOSE = False # 浏览器关闭后cookie是否过期,默认False不过期,建议True
# SESSION_SAVE_EVERY_REQUEST = False # 每一次请求,是否更新session字段的过期时间,默认False不更新,建议True