python django百度搜索图片分页及uwsgi部署

参考视频链接:
https://www.bilibili.com/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.com/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&copyright=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.net/npm/@bootcss/v3.bootcss.com@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.net/npm/@bootcss/v3.bootcss.com@1.0.36/dist/js/bootstrap.min.js"></script>
    <script src="https://fastly.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
    <script src="https://fastly.jsdelivr.net/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.net/npm/@bootcss/v3.bootcss.com@1.0.36/assets/js/vendor/jquery.min.js"><\/script>')


    </script>
    <script src="https://fastly.jsdelivr.net/npm/@bootcss/v3.bootcss.com@1.0.36/dist/js/bootstrap.min.js"></script>
    <script src="https://fastly.jsdelivr.net/npm/@bootcss/v3.bootcss.com@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