Web服务器的基本概念

相信大家都在上一章节把项目启动了。
那我们第一课从本机的ip地址开始。
首先,请各位找到自己启动服务的电脑的ip地址。
也就是你电脑在局域网中的ip地址。
一般都是192.168.0.xxx192.168.1.xxx

不会找的就按照下面的方式。
在搜索引擎中输入<你的操作系统> 如何查看本机ip地址

例如:windows 如何查看本机ip地址

然后打开你的手机中的浏览器,在地址栏输入<ip地址>:8000

例如:192.168.1.111:8000

你就可以看到一个歌词网站,里面目前有三首歌的歌词。

网站的工作原理

如下图所示:

我们在手机浏览器中输入<ip地址>:8000并按下回车的这个动作,
其实它的含义是:
向这个IP的8000端口发出一个Request(请求)

而当服务器接收到我们的Request后,就会返回一个Response(响应)

这里的Response是一个HTML文件。
浏览器会解析这个HTML文件,然后渲染出我们看到的网页。


Note: 后续的文章中都会使用英语名词,以免后续出现歧义。
第一次出现的英语名词,我都会用括号标注中文含义,学习编程,英语很重要

我们平时输入网址来打开网页,其实也是在用IP地址来进行请求的。
例如我的博客网址是http://wongyusing.com/,而你使用http://120.78.163.126:80同样也能进入到我的博客页面。
网址我们一般称作域名,我的域名是wongyusing.com
未来各位的博客上线时也可以去购买域名来进行部署。

各位现在留意一下你们的终端机。
然后在手机上的浏览器依次输入下面的地址,留意终端机和页面的提示信息。

bash
http://192.168.1.xxx:8000/post

# 注意后面的斜杠,一定要有
# 没有会报404
http://192.168.1.xxx:8000/article/2/

http://192.168.1.xxx:5000

第一个地址会提示404,页面不存在。
第二个地址会提示200,页面请求成功。
第三个地址没有提示,页面会显示,无响应。

上面的Request和Response大家可以理解为我们生活中的打电话的过程。
例如你在手机上拨号138xxxxxxxx,按下拨号的时候就是Request。
你的手机是Client。
对方的手机是Server。
下面的内容一一对应上面的提示,相当于是Response:

  • 当你拨打了一个不存在的手机号码,会提示,“你所拨打的号码是空号”。
  • 拨打了一个存在的手机号码,对方接听了并给予了回应,就是成功响应。
  • 相当于是你拨打了一个关机了的手机号码,

Server是如何工作的?

大家先用之前下载的VsCode来打开这个项目。
项目结构如下:
这个项目结构不要学,非常不专业,这个只是我随便写的一个DEMO。 大家只需要专注于我给出注释的文件和目录,其他先不要管,后面我会给出一个专业的项目布局方案

bash
demo
├── db.sqlite3
├── demo
│   ├── __init__.py
│   ├── __pycache__
│   │   ├── __init__.cpython-38.pyc
│   │   ├── settings.cpython-38.pyc
│   │   ├── urls.cpython-38.pyc
│   │   ├── views.cpython-38.pyc
│   │   └── wsgi.cpython-38.pyc
│   ├── asgi.py
│   ├── settings.py  
│   ├── views.py  
│   ├── urls.py  # 路由表
│   └── wsgi.py
├── lyrics
│   └── 《后来》.txt  
├── manage.py
├── media
│   ├── 1.jpg
│   ├── 2.jpg
│   ├── 3.jpg
│   ├── 4.jpg
│   └── bg.jpg
├── requirements.txt
├── static
│   ├── css
│   │   ├── bootstrap.min.css
│   │   ├── style.css
│   │   └── themes.min.css
│   └── js
│       ├── bootstrap.min.js
│       ├── iconfont.js
│       ├── jquery.slim.min.js
│       └── popper.min.js
│  
└── templates # 模板文件目录,里面都要看一看
    ├── article_1.html
    ├── article_2.html
    ├── article_3.html
    ├── article_list.html
    └── home.html

8 directories, 31 files

首先,请各位运行电脑的浏览器的地址栏中输入http://127.0.0.1:8000

之前,为了让大家更为直观的感受到Server和Client的区别,才让大家用手机访问我们的服务。
127.0.0.1其实我们电脑本地主机的ip地址,只能由本地主机访问。

在VsCode中打开demo/urls.py文件。
内容如下:

python
"""demo URL Configuration
   Demo 的URL(网址)结构

The `urlpatterns` list routes URLs to views. For more information please see:
`urlpatterns`(网址格式)列表会将里面的路径指向对应的views(视图),更多详情,请参阅以下链接
    https://docs.djangoproject.com/en/3.1/topics/http/urls/
Examples:
示例:

Function views
函数视图
    1. Add an import:  from my_app import views
    一、导入一个视图文件: 从 我的应用中 导入 views文件
    2. Add a URL to urlpatterns:  path('', views.home, name='home')
    二、添加一个网址到 网址格式中: 路径方法(空字符串,views中的home方法,该方法对应的变量名)
    空字符串代表无,在`总路由表`中代表首页,

Class-based views
基于类的视图
    1. Add an import:  from other_app.views import Home
    一、导入一个视图文件: 从 其它应用中的views文件 导入 Home类
    2. Add a URL to urlpatterns:  path('', Home.as_view(), name='home')
    二、 添加一个网址到 网址格式中:路径方法(空字符串,将Home作为视图(实例化),该方法对应的变量名)

Including another URLconf
引入 另一个url配置(可理解为导入另外一个urls.py文件或理解为导入`子路由`)
    1. Import the include() function: from django.urls import include, path
    一、导入 包括方法: 从django的网址包中导入 包括和路径方法
    2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
    二、添加一个网址到 网址格式中: 路径方法('blog/',包括("根目录下的blog目录中的urls文件"))
    该方法会将blog.urls中的所有路径配置放到 "blog/"下,如下所示

    http://127.0.0.1:8000/blog/xxxxxx
    http://127.0.0.1:8000/blog/yyyyyy

"""
# 从 django的urls包 导入 路径方法
from django.urls import path

# 从 django的配置包 导入 设置方法
from django.conf import settings

# 从 django的配置包的url中的 静态文件 导入 静态路径方法
from django.conf.urls.static import static

# 从  项目的根目录下的demo 导入views文件
from demo import views

# 网址格式列表
urlpatterns = [
        # 首页
        # 路径方法(“空字符串”,views文件中的home函数)
        # http://127.0.0.1:8000
        path("", views.home),

        # 文章列表
        # 路径方法(“article/”,views文件中的 文章列表 函数)
        # http://127.0.0.1:8000/article/
        path('article/', views.article_list),

        # 人来人往
        # 路径方法(“article/1/”,views文件中的 第一篇文章 函数)
        # http://127.0.0.1:8000/article/1/
        path('article/1/', views.article_1),

        # 新禅院钟声
        # 路径方法(“article/2/”,views文件中的 第二篇文章 函数)
        # http://127.0.0.1:8000/article/2/
        path('article/2/', views.article_2),

        # 挪威的森林
        # 路径方法(“article/3/”,views文件中的 第三篇文章 函数)
        # http://127.0.0.1:8000/article/3/
        path('article/3/', views.article_3),

    # 根据项目设置中的的 媒体文件 配置 媒体文件的配置(如你们在网页中看到的图片)
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

现在我们从http://127.0.0.1:8000这个地址开始分析我们看到这个页面是从哪里来的

首先,一个http://127.0.0.1:8000的Request发送到我们的Server中。
我们的Server会将http://127.0.0.1:8000这个地址放到我们的总路由表中进行匹配。
由上可知,会匹配到我们的path(“”, views.home),中。
这里路径是由views中的home函数处理。

python
# 从 Django中的快捷方法包中 导入 渲染方法
from django.shortcuts import render

# 首页 函数
def home(request):
    """
    Input:参数是 request 即 请求

    Output: 将home.html进行渲染, 作为响应返回给这个请求
    """
    response = render(request,template_name='home.html')

    return response

大家可以在浏览器中,在页面上,鼠标右键,选择查看网页源代码,然后打开项目中templates下的home.html文件进行对比。
不难发现,网页源代码和我们home.html是一模一样的。
各位可以根据以下的表打开文件和链接,进行对比。

HTML文件 Link
home.html http://127.0.0.1:8000
article_list.html http://127.0.0.1:8000/article/
article_1.html http://127.0.0.1:8000/article/1/
article_1.html http://127.0.0.1:8000/article/2/
article_1.html http://127.0.0.1:8000/article/3/

Models、View、Template 三分天下

上面的过程可能有点难以理解。
其实Django是属于MTV(Model, Template, View)框架。
目前,这个项目只用到,Template(模板文件),View(视图)。
Model(模型)我们后面再去介绍。
正所谓一图胜千言,我们来看图,看不清楚就放大来看。

注意:市面上大多数的框架都是采用MVC(Model, View, Controller)的结构。
区别如下:

MVC MTV
数据模型 Model Model
用户界面 View Template
业务逻辑 Controller View

简单来讲,只是命名的问题而已,它们的设计思想是一样的。 不必在意

作业

大家可以发现,项目中有一个叫《后来》.txt

我们的作业就是添加这个歌词到我们的项目中。
当我们在浏览器的地址栏中输入http://127.0.0.1:8000/article/4/能够看到《后来》这首歌的歌词。
只需要细心观察,不同页面的区别,然后进行复制和粘贴就好了,不会很难。