基于django的网站建设(选择windows服务器版本)

clh0980507

已于 2024-05-30 03:27:28 修改

阅读量975

点赞数 25

文章标签： django python 后端 javascript bootstrap mysql

于 2024-05-07 16:02:03 首次发布

本文链接：https://blog.csdn.net/clh0980507/article/details/136173461

版权

一、利用pycharm创建django项目

利用专业版pycharm创建django项目，修改项目位置，配置解释器（一般默认即可），点击创建即可，如下图

其中模板文件夹(templates)，配置文件(settings.py)，路径文件(urls.py)，组织管理文件(manage.py)将会是我们常用的初始文件。

(一)、配置文件(settings.py)的介绍与修改

如下图，有了该配置，整个django项目才知道在哪里检索模板文件夹，有多个同名模板文件夹存在于不同文件夹，则django会按照其所处层级依次遍历查找，或则也可以在配置文件中直接配置所需要的模板文件夹所在路径，在setting中templates上级路径应与templates文件对应。

(二)、创建注册app(一个应用)

1.创建app

在终端执行一下命令 python manage.py startapp learning01(app名称) 创建app 其中，初学者不要改动migrations文件、apps.py、test.py、admin.py

migrations文件: 数据库变更记录

admin.py：Django默认提供admin后台管理

test.py：单元测试

apps.py：app启动类

views.py: url中的函数一般定义在这里面

models.py: 对数据库进行操作

2.注册app

在setting中设置如下

只有设置注册好后才能启动

(三)、快速创建网页并启动

在urls.py中设置好访问路径和对应的函数，并在views.py中创建好对应的函数，再点击运行或在命令行执行python manage.py runserver

点击地址访问即可

若路径不为空，则还需要在初始地址后面拼接路径，跳转到指定路径访问

但是！一个合格的网页是集前端，后端，数据库与一体的，上面只是实现了第一个简单网页的启动，接下来讲正式进入django项目的制作

二、开始创建拥有数据库与前端的django项目

(一)、静态文件

图片、css、js、插件(bootstrap等第三方web框架之类的)、其他部分文件资源(如Excel、Word、TXT之类的)我们将其归纳于静态文件资源，统一放到static文件夹下面

此处，作者将jquery (jQuery)和bootstrapV5(Bootstrap v5 中文文档 · Bootstrap 是全球最受欢迎的 HTML、CSS 和 JS 前端工具库。 | Bootstrap 中文网 (bootcss.com))放到对应的文件夹下，下载链接在下方

bootstrapV5:Bootstrap v5 中文文档 · Bootstrap 是全球最受欢迎的 HTML、CSS 和 JS 前端工具库。 | Bootstrap 中文网 (bootcss.com)https://v5.bootcss.com/ jquery : jQueryhttps://jquery.com/

简单的静态资源引用示例：

#views.py
from django.shortcuts import render, HttpResponse


def download(request):
    return render(request, 'login_interface.html')

#urls.py
from django.urls import path
from learning01 import views

urlpatterns = [
    path('', views.download),
]

{% load static %}
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>登录界面</title>
    <script src="{% static 'js/jquery-3.6.4.min.js' %}"></script>
    <script src="{% static 'js/popper.min.js' %}"></script>
    <script src="{% static 'pulgins/bootstrap-5.3.0-alpha1-dist/js/bootstrap.min.js' %}"></script>
    <link rel="stylesheet" type="text/css" href="{% static 'css/html_ini.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'pulgins/bootstrap-5.3.0-alpha1-dist/css/bootstrap.min.css' %}">
</head>
<body class="m-0 p-0">
    <div class="row m-0 p-0 h-100">
        <div class="col-8 p-0 m-0">
            <img class="h-100 w-100 p-0 m-0" src="{% static 'image/1.jpg' %}" alt="无法载入图片资源">
        </div>
        <div class="col p-0 m-0">
            <div class="card text-center w-100 h-100">
                <div class="card-header">
                Featured
                </div>
                <div class="card-body position-relative">
                    <div class="position-absolute top-50 start-50 translate-middle w-100">
                        <div class="input-group mb-5">
                            <label class="input-group-text" for="username_input">用户名</label>
                            <input type="text" class="form-control" placeholder="请输入用户名" id="username_input">
                        </div>
                        <div class="input-group mb-5">
                            <label class="input-group-text" for="password_input">密码</label>
                            <input type="text" class="form-control" placeholder="请输入用户密码" id="password_input">
                        </div>
                    </div>
                </div>
                <div class="card-footer text-muted btn-group" role="group">
                    <button type="button" class="btn btn-primary">登录</button>
                    <button type="button" class="btn btn-success">注册</button>
                </div>
            </div>
        </div>
    </div>
</body>
</html>

/*html_ini.css*/
*{
    padding: 0;
    margin: 0;
}
html,body{
    height: 100%;
    width: 100%;
}

运行结果：

(二)、配置数据库

(一)、创建数据库

创建一个该项目的数据库，本文使用的是mysql，首先要安装包mysqlclient

1. 进入Mysql

mysql -u root -p

2.查看已有数据库

show databases;

3. 创建新的数据库

create database learning01;

4. 删除数据库

drop database (数据库名);

5. 进入数据库

use (数据库名);

6. 查看某数据库的数据表

show tabels;

(二)、连接数据库

在setting中配置数据库

DATABASES = {
    'default': {
        'ENGINE': 'django.db.backends.mysql',
        'NAME': '数据库名',
        'USER': '用户名',
        'PASSWORD': '数据库密码',
        'HOST': '127.0.0.1(数据库地址，本地为该地址)',
        'POST': 3306(窗口),
    }
}

(三)、创建数据表

Django中不需要直接操作数据库，而是通过models.py来增加或者修改数据库，上文已经做好了登录界面，接下来创建一个用户表，用以存储用户信息，首先在models.py中输入如下代码：

from django.db import models


# Create your models here.
class UserInfo(models.Model):
    Id = models.AutoField(verbose_name="用户id", primary_key=True)    # 主键设置为自动增长
    Username = models.CharField(verbose_name="用户名", blank=False, max_length=32, unique=True)
    Password = models.CharField(verbose_name="用户密码", blank=False, max_length=32, unique=True)
    user_choice = (
        (0, '管理员'),
        (1, '用户'),
    )
    userType = models.SmallIntegerField(verbose_name='权限级别', default=1, choices=user_choice)

    def __str__(self):
        return '%d%s%s%d' % (self.Id, self.Username, self.Password, self.userType)

    class Meta:
        db_table = 'UserInfo'
        verbose_name = '用户信息'

再在终端执行以下下命令：

//先执行该命令
python manage.py makemigrations
//再执行以下命令
python manage.py migrate

执行成功后如图

接下来我们可以在views.py中编写注册函数，登录函数，创建管理员账户，在前端中编写登录或者点击注册后跳转的页面，发送登录或者注册请求的函数，以实现登录或者注册功能

(四)编写登录和注册相关功能

思路分析：我们已经有了输入账户密码，跳转登录/注册界面的按钮，以及对应的用户数据库，只要我们实现从前端获取对应的用户信息，验证成功后跳转到对应的用户界面即可。即，接下来需要完成如下几步(这里为了方便展示，跳过注册部分，内部设置好登录账号，完成登录部分的展示)：

1.实现点击登录后验证用户信息并跳转到对应的用户页面的功能

2.编写用户界面

1.实现点击登录后验证用户信息并跳转到对应的用户页面的功能

1). 点击登录按钮后将用户信息传入后端

首先创建该项目的综合JavaScript文件，将其放在static/js下，我这里命名为learning01.js；

再在login_interface.html的head部分新增脚本代码如下，导入js文件，然后就可以在该js文件中编写咱们的登录校验函数或者其他函数；

<script src="{% static 'js/learning01.js' %}"></script>

接下来在登录按钮上新增点击触发函数，并通过模板语法设置好登录失败的信息提示：

{# 在login_interface.html中对应的板块做如下修改，这里我就不展示完整的html代码了，
修改部分自己对应的去修改 #}

<div class="card-header">
    {{ error_msg }}
</div>

<button type="button" class="btn btn-primary" onclick="loging_valid()">登录</button>

在learning01.js中编写函数loging_valid()

// input控件生成器
function input_create(i_name,i_value) {
    const input = document.createElement('input');
    input.type = 'hidden';
    input.name = i_name;
    input.value = i_value;
    return input;
}
//登录校验函数
function loging_valid(){
    let username,password;
    username=document.getElementById("username_input").value;
    password=document.getElementById("password_input").value;
    //上面是通过元素id来获取页面信息，这里我们获取了页面中用户名输入框和密码框所含的信息
    //console.info(username, password); // 该函数可以在控制台打印对应的变量信息
    //接下来通过form表单的形式将获取到的信息以字典形式传入到后端，这里我将该操作标记为操作1，若校验成功，则返回校验成功的信息
    //其实可以直接在前端使用form表单，但是这里还可以演示在js中创建form，就不去前端修改了
    const form1 = document.createElement('form');
    form1.method = 'post';
    form1.action = '/user/';
    form1.appendChild(input_create("username", username));  //这里input框的name不要与本来就有的页面元素重合
    form1.appendChild(input_create("password", password));
    document.body.appendChild(form1);
    form1.submit();//提交POST请求
    document.body.removeChild(form1);//删除整个form标签
}

这里是只启用console.info函数同时为修改card_header部分的div时，点击登录后的控制台的输出，证明我们已经成功用js获取到了页面信息

2).在后端接收数据并校验，成功后跳转到用户界面

首先，在urls.py中设置好/user/路径下对应的函数

urlpatterns = [
    # path('admin/', admin.site.urls),

    path('', views.download),

    path('user/', views.loging_valid),  # 新增语句
]

我们在views.py中编写好接收请求的函数，这里注意，通过form表单发过来的请求需要在接收函数的上面加上@csrf_exempt，加这个装饰器的原因如下：

Django Django中的@csrf_exempt是什么|极客教程 (geek-docs.com)https://geek-docs.com/django/django-questions/129_django_what_is_csrf_exempt_in_django.html在views.py中加上如下函数查看后端接收到的前端函数：

from django.shortcuts import render, HttpResponse
from django.views.decorators.csrf import csrf_exempt

@csrf_exempt
def loging_valid(request):
    if request.method == 'POST':
        print(request.POST)
    return render(request, 'login_interface.html')

输入信息并点击登录后运行结果如下：

<QueryDict: {'username': ['123456'], 'password': ['learning123'], 'op_num': ['1']}>

接下来我们在后端编写一个创建用户的函数并完善用户验证函数：

from learning01.models import UserInfo


def creat_test_user():
    """
    用于创建测试用户
    因为主键设置为了自动增长字段，所以在我们创建用户时不需要管主键
    """
    if not UserInfo.objects.filter(Username='developer', Password='developer01', userType=0).exists():
        UserInfo.objects.create(Username='developer', Password='developer01', userType=0)
        print('添加成功')

验证函数完善如下：

@csrf_exempt
def loging_valid(request):
    creat_test_user()   # 此处是为了创建一个测试用户，故此调用一次，调用完后可以注释掉
    if request.method == 'POST':
        req_data_dict = {'username': request.POST['username'],
                         'password': request.POST['password'],
                         'op_num': int(request.POST['op_num'])}
        if UserInfo.objects.filter(Username=req_data_dict['username'], Password=req_data_dict['password']).exists():
            return HttpResponse('登录成功')
    return render(request, 'login_interface.html')

执行结果如下：

这里我没有打印用户添加成功的信息，是因为之前我已经添加好了。

2.编写用户界面

至此我们可以开始编写登录后的用户界面，这里常规的html页面编写这里就不介绍了，这里通过用户界面的编写介绍Django模板语法和表单的生成。

...

待更新

三、Windows部署Django项目

本文以部署在本地服务器为例，部署好后服务器所在的局域网可访问网站

(一)、收集项目所依赖的库

将当前环境中的所有依赖的库名及其对应的版本号生成到一个名为 requirements.txt 的文件中，在终端使用命令pip freeze > requirements.txt

这样要在部署的服务器上安装所需要的库只需要执行命令pip install -r requirements.txt即可快速安装项目相关的依赖包

(二)、安装和配置IIS

简单阐述如何安装和配置IIS。在Windows 系统中依次选择“控制面板”—“程序和功能”—-“打开或关闭 Windows 功能”选项，找到Internet Information Services(Internet信息服务)，全部勾选即可。

(三)、开放端口

只有开放了访问端口，其他计算机才可通过网络访问你部署的网站，此处仅局域网可访问。

首先打开 Windows 操作系统的“控制面板”，找到“Windows Defender 防火墙”单击进人防火墙配置界面，如下图所示。

单击左侧菜单栏中的“高级设置”按钮进入高级设置界面,在左侧“入站规则”面板中单击“新建规则”按钮，进入入站规则向导界面,如下图所示。

选中“端口”单选按钮，然后单击“下一页”按钮，进入端口设置界面，我这里选择5001端口开放，如下图所示。设置好后依次点击下一页即可。

(四) 、部署项目

1、安装并启动wfastcgi

为了Djingo项目能够部署到 IIS 服务器上,需要安装 Python 包 wfastcgi，以管理员身份打开命今行进行安装(注意此处必须要以管理员身份,否则会安装失败),输人命令

pip install wfastcgi

安装完成后需要启动 wfastcgi,继续在终端中输人命令:

wfastcgi-enable

在控制台会输出下面的结果

到这一步说明wfastcgi安装成功并且已经成功启动。输出结果最后冒号中的内容即为Python和wfastcgi解释器核心脚本的具体路径，用符号“|”隔开该路径在后面的web配置文件中会使用到。

2、配置web.config文件

为了能够让IIS服务器准确地运行项目,需要配置和设定一些参数，包括项目路径项配置文件路径、解析器等。一种简单办法就是通过添加服务器配置文件实现。具体的，在项目根路径下创建一个web.config 文件，添加内容如下：

<?xml version="1.0" encoding="UTF-8"?>

<configuration>

  <system.webServer>

    <handlers>

      <add name="Python FastCGI" path="*" verb="*" modules="FastCgiModule" scriptProcessor="python安装路径|wfastcgi文件所在路径" resourceType="Unspecified" requireAccess="Script" />

    </handlers>

    <httpErrors errorMode="Detailed" />

  </system.webServer>

  <appSettings>

    <add key="WSGI_HANDLER" value="django.core.wsgi.get_wsgi_application()" />

    <add key="PYTHONPATH" value="项目路径" />

    <add key="DJANGO_SETTINGS_MODULE" value="hengDaProject.settings" />

  </appSettings>

</configuration>

这里对照着自己的网站,修改三处地方替换即可。

(1)、scriptProcessor 中冒号部分分别填人前面对应的 Python和 wfastcgi解释器核心脚本文件所在路径。

(2)、这里的 value要替换成当前的项目根目录(跟manage.py同目录)。

(3)、< add key=“DJANGO_SETTINGS_MODULEvalue=”exam.settings”/>这里value处需要写人项目配置模块名称。

3、静态文件迁移

在项目根目录下的 static文件夹中同样创建一个 web.config 文件,文件内容如下

<?xml version="1.0" encoding="UTF-8"?>

<configuration>

  <system.webServer>

    <handlers>

      <remove name="Python FastCGI" />

    </handlers>

  </system.webServer>

</configuration>

该文件用于为IIS指明静态资源文件的渲染方式。接下来需要将项目所有的静态资源文件css、js、img等全部导人到static 文件夹中。

4、IIS创建网站

在控制面板的windows工具中打开“Internet Information Services(IIS)管理器”。在IIS管理器左侧导航面板中右击“网站”,在弹出的快捷菜单中选择“添加网站”选项，进入网站添加界面。然后按照下图进行网站创建,其中,物理路径为项目根目录,IP 地址和主机名可以不用填写，端口号采用之前开放的端口,端口号的设置不能与本机当前其他网站或程序冲突，最后单击“确定”按钮完成项目部署。

至此，网站部署成功，可以让局域网的朋友们都访问你的网站，想要互联网可用还需要网络备案和购买ip，在此就不多做介绍了。

clh0980507

关注

25
点赞
踩
8

收藏

觉得还不错? 一键收藏
1
评论
基于django的网站建设(选择windows服务器版本)

如下图，有了该配置，整个django项目才知道在哪里检索模板文件夹，有多个同名模板文件夹存在于不同文件夹，则django会按照其所处层级依次遍历查找，或则也可以在配置文件中直接配置所需要的模板文件夹所在路径，在setting中templates上级路径应与templates文件对应。
复制链接

扫一扫