django实现分页功能
- 1 创建django项目和所需数据库及应用
- 2 修改setting.py配置文件
- 3 修改WebExpress/urls.py配置
- 4 修改picture/urls.py配置
- 5 修改picture/models.py配置
- 6 添加picture/baidu_picture.py文件
- 7 修改picture/views.py
- 8 添加picture/templates/picture_list.html文件
- 9 数据库迁移并生成数据表
- 10 运行项目
- 11 页面显示
- 12 在项目跟目录下创建bin目录
- 13 在项目根目录下创建deploy目录
- 14 执行shell脚本
参考视频链接:
https://www.bilibili/video/BV1Tu411r7qx?p=43
1 创建django项目和所需数据库及应用
# 1 创建数据库WebExpress
mysql -uroot -p123456
create database WebExpress default charset utf8;
# 2 创建项目project
django-admin startproject WebExpress
# 3 创建应用app01
cd project
python manage.py startapp picture
2 修改setting.py配置文件
ALLOWED_HOSTS = ['*']
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'picture.apps.PictureConfig',
]
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.mysql',
'NAME': 'WebExpress',
'USER': 'root',
'PASSWORD': 'Huawei@123',
'HOST': '127.0.0.1',
'PORT': '3306',
}
}
3 修改WebExpress/urls.py配置
from django.contrib import admin
from django.urls import path, include
urlpatterns = [
path('admin/', admin.site.urls),
path('picture/', include('picture.urls')),
]
4 修改picture/urls.py配置
from . import views
from django.urls import path
urlpatterns = [
path('list/', views.picture_list, name='picture_list'),
]
5 修改picture/models.py配置
from django.db import models
class PictureList(models.Model):
picture_name = models.CharField(max_length=200)
query_word = models.CharField(max_length=200)
picture_url = models.CharField(max_length=200)
6 添加picture/baidu_picture.py文件
# -*- coding:utf8 -*-
import json
import requests
import random
from . import models
class BaiduPictureDownload:
def __init__(self, query_word):
self.query_word = query_word
self.user_agent = [
"Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/14.0.835.163 Safari/535.1",
"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36",
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_0) AppleWebKit/535.11 (KHTML, like Gecko) Chrome/17.0.963.56 Safari/535.11",
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10.6; rv:2.0.1) Gecko/20100101 Firefox/4.0.1"
]
self.headers = {
"User-Agent": random.choice(self.user_agent),
"sec-ch-ua-platform": "macOS",
"X-Requested-With": "XMLHttpRequest",
"Sec-Fetch-Site": "same-origin",
'sec-ch-ua': '" Not A;Brand";v="99", "Chromium";v="102", "Google Chrome";v="102"',
}
def response(self):
url = "https://image.baidu/search/acjson?tn=resultjson_com&" \
"logid=8570046982900849301&" \
"ipn=rj&" \
"ct=201326592&" \
"is=&fp=result&fr=&" \
"word=%s" \
"queryWord=%s" \
"cl=2&lm=-1&ie=utf-8&oe=utf-8&adpicid=&st=-1&" \
"z=0&ic=0&hd=0&latest=0©right=0&s=&se=&tab=&" \
"width=&height=&face=0&istype=2&qc=&nc=1&" \
"expermode=&nojc=&isAsync=&pn=100&rn=100&gsm=3c&1654497570412=" %(self.query_word, self.query_word)
resp = requests.get(url=url, headers=self.headers)
return json.loads(resp.text)
def result(self):
json_info = self.response().get('data')
for picture_info in json_info:
if picture_info.get('thumbURL') and picture_info.get('fromPageTitleEnc'):
data = {
'picture_url': picture_info.get('thumbURL'),
'query_word': self.query_word,
'picture_name': picture_info.get('fromPageTitleEnc')
}
if not models.PictureList.objects.filter(**data).first():
models.PictureList.objects.create(**data)
if __name__ == '__main__':
response = BaiduPictureDownload('娜扎')
response.result()
7 修改picture/views.py
from django.shortcuts import render
from .baidu_picture import BaiduPictureDownload
from . import models
from django.utils.safestring import mark_safe
def picture_list(request):
search_data = request.GET.get('q', "")
if search_data:
try:
models.PictureList.objects.all().delete()
response = BaiduPictureDownload(search_data)
response.result()
except Exception:
pass
page = int(request.GET.get('page', 1))
page_size = 5
start_page = (page - 1) * page_size
end_page = page * page_size
queryset = models.PictureList.objects.all()[start_page: end_page]
#数据总条数
total_count = models.PictureList.objects.all().count()
# 总页码
total_page_count, div = divmod(total_count, page_size)
if div:
total_page_count = total_page_count + 1
# 计算出当前页,前5页后5页
plus = 3
if total_page_count <= (2 * plus + 1):
# 数据库中的数据比较少,都没有达到11页
first_5_pages = 1
last_5_pages = total_page_count
else:
# 数据库中数据较多时
# 当前页小于5
if page <= plus:
first_5_pages = 1
last_5_pages = 2 * plus
else:
# 当前页 > 5
# 当前页+5 > 总页面
if (page + plus) > total_page_count:
first_5_pages = total_page_count - 2 * plus
last_5_pages = total_page_count
else:
first_5_pages = page - plus
last_5_pages = page + plus
page_str_list = []
# ul开始标签
ul_body_start_string = '<ul class="pagination">'
page_str_list.append(ul_body_start_string)
# 首页页码
home_page = '<li><a href="?page={}">首页</a></li>'.format(1)
page_str_list.append(home_page)
# 上一页
if page > 1:
previous = '<li><a href="?page={}">上一页</a></li>'.format(page - 1 )
else:
previous = '<li class="disabled"><a href="?page={}">上一页</a></li>'.format(1)
page_str_list.append(previous)
# 翻页主体
for i in range(first_5_pages, last_5_pages + 1):
if i == page:
ele = '<li class="active"><a href="?page={}">{}</a></li>'.format(i,i)
else:
ele = '<li><a href="?page={}">{}</a></li>'.format(i,i)
page_str_list.append(ele)
# 下一页
if page < total_page_count:
nextpage = '<li><a href="?page={}">下一页</a></li>'.format(page + 1)
else:
nextpage = '<li class="disabled"><a href="?page={}">下一页</a></li>'.format(total_page_count)
page_str_list.append(nextpage)
# 尾页
last_page = '<li><a href="?page={}">尾页</a></li>'.format(total_page_count)
page_str_list.append(last_page)
# 搜索框
search_string = """
<li>
<form method="get" style="float: left;margin-left: -1px;">
<input type="text" placeholder="页码" name="page" style="position: relative;float:left;display:
inline-block;width: 80px;border-radius: 0;" class="form-control">
<button style="border-radius: 0" class="btn btn-default" type="submit">
搜索
</button>
</form>
</li>
"""
page_str_list.append(search_string)
# ul开始标签
ul_body_end_string = '</ul>'
page_str_list.append(ul_body_end_string)
page_string = mark_safe("".join(page_str_list))
return render(request, 'picture_list.html', locals())
8 添加picture/templates/picture_list.html文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Picture List</title>
<link href="https://fastly.jsdelivr/npm/@bootcss/v3.bootcss@1.0.36/dist/css/bootstrap.min.css"
rel="stylesheet">
<style>
.navbar{
border-radius: 0;
}
</style>
</head>
<body>
<div class="container">
<br>
<!-- ————————————————————搜索框———————————————————— -->
<div style="float: right;width: 300px;">
<form method="get" action="{% url 'picture_list' %}">
{% csrf_token %}
<div class="input-group">
<input type="text" class="form-control" placeholder="{{ queryset.0.query_word }}" name="q"
value="{{ search_data }}">
<span class="input-group-btn">
<button class="btn btn-default" type="submit">
<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
</button>
</span>
</div>
</form>
</div>
<!-- ————————————————————页面主体内容———————————————————— -->
<div class="bs-example" data-example-id="simple-table">
<table class="table">
<caption><h1> {{ queryset.0.query_word }} </h1></caption>
<thead>
<tr>
<th>ID</th>
<th>图片展示</th>
<th>图片名称</th>
</tr>
</thead>
<tbody>
{% for i in queryset %}
<tr>
<!-- <th scope="row"> {{ forloop.counter }}</th>-->
<th scope="row"> {{ i.id }}</th>
<td><img src="{{ i.picture_url }}" alt="" height="300" width="280"></td>
<td>{{ i.picture_name }}</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<!--页码-->
{{ page_string }}
<!-- ————————————————————script———————————————————— -->
<script src="https://fastly.jsdelivr/npm/@bootcss/v3.bootcss@1.0.36/dist/js/bootstrap.min.js"></script>
<script src="https://fastly.jsdelivr/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="https://fastly.jsdelivr/npm/jquery@1.12.4/dist/jquery.min.js"
integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ"
crossorigin="anonymous"></script>
<script>
window.jQuery || document.write('<script src="https://fastly.jsdelivr/npm/@bootcss/v3.bootcss@1.0.36/assets/js/vendor/jquery.min.js"><\/script>')
</script>
<script src="https://fastly.jsdelivr/npm/@bootcss/v3.bootcss@1.0.36/dist/js/bootstrap.min.js"></script>
<script src="https://fastly.jsdelivr/npm/@bootcss/v3.bootcss@1.0.36/assets/js/docs.min.js"></script>
</div>
</body>
</html>
9 数据库迁移并生成数据表
python manage.py makemigrations
python manage.py migrate
10 运行项目
python manage.py runserver 0.0.0.0:8000
11 页面显示
http://127.0.0.1:8000/picture/list/?page=2
12 在项目跟目录下创建bin目录
目录结构如下
在bin目录下添加脚本WebExpress
#!/bin/bash
CURRENT_DIR=$(cd "$(dirname "${BASH_SOURCE[0]}")" &>/dev/null && pwd)
PROJECT_DIR=$(dirname "${CURRENT_DIR}")
# uwsgi 目录
# UWSGI_PATH="/Users/wangze/PycharmProjects/pythonProject/WebExpress/bin"
# UWSGI_PATH="$PROJECT_DIR"/bin
## shellcheck disable=SC2120
status() {
uwsgi_status=$(ps -ef | grep "${PROJECT_DIR}"/deploy/uwsgi.ini | grep -v grep)
if [ -n "$uwsgi_status" ]; then
if [ "$1" == "print" ]; then
echo "WebExpress [running]"
fi
return 0
else
if [ "$1" == "print" ]; then
echo "WebExpress [not running]"
fi
return 1
fi
}
start() {
status
if [ $? -ne 0 ]; then
# $UWSGI_PATH --ini "${PROJECT_DIR}"/deploy/uwsgi.ini >/dev/null 2>&1
uwsgi --ini "${PROJECT_DIR}"/deploy/uwsgi.ini >/dev/null 2>&1
sleep 5
status
if [ $? -ne 0 ]; then
echo "start WebExpress failed"
return 1
else
echo "start WebExpress success"
return 0
fi
fi
echo "WebExpress is already [running]"
return 0
}
stop() {
status
if [ $? -ne 0 ]; then
echo "WebExpress is already [not running]"
return 0
else
# $UWSGI_PATH --stop "${PROJECT_DIR}"/deploy/uwsgi.pid
uwsgi --stop "${PROJECT_DIR}"/deploy/uwsgi.pid
sleep 3
status
if [ $? -ne 0 ]; then
echo "stop WebExpress success"
return 0
else
echo "start WebExpress failed"
return 1
fi
fi
}
main() {
case $1 in
status)
status "print"
;;
start)
start
;;
stop)
stop
;;
restart)
stop
sleep 3
start
;;
*) echo "usage: $0 [start|stop|restart|status]" ;;
esac
}
main "$1"
13 在项目根目录下创建deploy目录
目录结构如下
在deploy目录下创建 uwsgi.ini 文件
[uwsgi]
# 使用nginx连接时使用
# socket=192.168.144.3:8090
# 直接做web服务器使用
http=127.0.0.1:8000
# 项目目录
chdir=/Users/wangze/PycharmProjects/pythonProject/WebExpress
# 项目中wsgi.py文件的目录,相对于项目目录
wsgi-file=WebExpress/wsgi.py
processes=4
threads=2
master=True
pidfile=../deploy/uwsgi.pid
daemonize=../deploy/uwsgi.log
# django+uwsgi+nginx开启8000端口
# server {
# listen 8000;
# server_name 192.168.144.3;
#location / {
#将所有的参数转到uwsgi下
# include uwsgi_params;
# #uwsgi的ip与端口
#uwsgi_pass 192.168.144.3:8090;
#}
#}
14 执行shell脚本
注意:执行前先停止 runserver
cd WebExpress/bin
bash WebExpress start
更多推荐
python django百度搜索图片分页及uwsgi部署
发布评论