【补充】动静态网页

【补充】动静态网页

【一】静态网页

  • 静态网页的数据是直接写死在页面上，不随时间或用户操作的改变而改变。
  • 它们通常是由HTML、CSS和JavaScript等静态资源组成。
  • 这种网页的特点是内容固定，不需要与后台服务器进行交互或实时获取数据。
  • 静态网页可以提供基本的展示信息，但无法根据实时情况进行动态更新。

【二】动态网页

  • 动态网页的数据是实时获取的，可以根据实际需要动态地更新页面内容。
  • 在动态网页中，后端服务器会与前端的网页进行交互，根据用户的请求或其他事件，从数据库或其他数据源中获取最新的数据，并将其展示到HTML页面上。
  • 例如，后端可以根据当前时间获取并展示实时的时间信息，或者从数据库中获取最新的新闻内容并展示在网页上。

【三】动态网页制作

  • urls
# -*-coding: Utf-8 -*-
# @File : urls .py
# author: Chimengmeng
# blog_url : https://www.cnblogs.com/dream-ze/
# Time：2023/7/7
from views import *

urls_list = [
    ("/index", index),
    ("/login", login),
    ("/register", register),
    ("/xxx", xxx),
    ("/get_time", get_time)
]
  • main
# -*-coding: Utf-8 -*-
# @File : 02 基于wsgrief .py
# author: Chimengmeng
# blog_url : https://www.cnblogs.com/dream-ze/
# Time：2023/7/6

from wsgiref.simple_server import make_server
from urls import urls_list
from views import *


def main(env, response):
    '''

    :param env: 请求相关的所有数据
    :param response: 相应相关的所有数据
    :return: 返回给浏览器的数据
    '''

    response('200 OK', [])

    # wsgiref 自动处理传进来的数据，封装成字典，更加方便操作
    # 从env中取到请求地址
    current_path = env.get('PATH_INFO')

    # 定义一个变量存储匹配到的函数名
    func = None
    for url in urls_list:
        if current_path == url[0]:
            func = url[1]

            # 匹配正确后，结束当前循环
            break

    # 判断 func 是否有值
    if func:
        # 匹配成功执行方法
        res = func(env)
    else:
        # 匹配失败返回 失败页面
        res = error(env)

    return [res.encode('utf8')]


if __name__ == '__main__':
    ip = '127.0.0.1'
    port = 8080
    server = make_server(ip, port, main)
    # 实时监听 ip:port 地址，只要有人访问就会触发run函数运行

    server.serve_forever()
  • view
# -*-coding: Utf-8 -*-
# @File : views .py
# author: Chimengmeng
# blog_url : https://www.cnblogs.com/dream-ze/
# Time：2023/7/7
import datetime
import os, sys
import time

BASE_DIR = os.path.dirname(os.path.abspath(__file__))

templates_path = os.path.join(BASE_DIR, 'templates')


def index(env):
    return 'index'


def login(env):
    return 'login'


def register(env):
    return 'register'


def error(env):
    return '404 error'


def xxx(env):
    file_path = os.path.join(templates_path, 'myxxx.html')
    with open(file_path, 'r', encoding='utf8') as f:
        return f.read()


def get_time(env):
    current_time = datetime.datetime.now().strftime('%Y-%m-%d %X')
    # 如何将后端获取到的数据反馈给html页面
    file_path = os.path.join(templates_path, 'my_time.html')
    with open(file_path, 'r', encoding='utf8') as f:
        data = f.read()

    data = data.replace('time', current_time)
    return data


if __name__ == '__main__':
    file_path = os.path.join(templates_path, 'myxxx.html')
    print(file_path)
  • my_time
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>

    <!--  本地 链接 引入方法  -->
    <!--  Websource 文件夹 拷贝到当前文件夹下即可使用  -->
    <!--  jQuery 文件  -->
    <script src="Websource\jQuery\node_modules\jquery\dist\jquery.min.js"></script>
    <!--  Bootstrap 的 JS 文件 (动画效果需要jQuery)  -->
    <script src="Websource\Bootstrap\js\bootstrap.min.js"></script>
    <!--  Bootstrap 的 CSS 样式文件  -->
    <link rel="stylesheet" href="Websource\Bootstrap\css\bootstrap.min.css">
    <!-- bootstrap-sweetalert(弹框) 的 CSS 文件   -->
    <link rel="stylesheet" href="Websource\bootstrap-sweetalert\dist\sweetalert.css">
    <!-- bootstrap-sweetalert(弹框) 的 JS 文件 -->
    <script src="Websource\bootstrap-sweetalert\dist\sweetalert.js"></script>


    <!--  CDN 链接 引入方法  -->
    <!--  Bootstrap 的 CSS 样式文件  -->
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.min.css">
    <!--  Bootstrap 的 JS 文件 (动画效果需要jQuery)  -->
    <script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.min.js">// bootstrap </script>
    <!--  jQuery 文件  -->
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"> // jquery</script>

    <!--  以下为 css样式书写区  -->
    <style>


    </style>

</head>
<body>
<h1>当前时间</h1>
time
</body>
</html>
posted @ 2023-07-07 09:49  Chimengmeng  阅读(4)  评论(0)  编辑  收藏  举报
/* */