前端（HTML）+预设（Django）+数据库（MySQL）：用户注册及登录演示改良版

最新推荐文章于 2023-05-28 02:57:00 发布

Outsider07

最新推荐文章于 2023-05-28 02:57:00 发布

阅读量320

点赞数

分类专栏： django 文章标签： django mysql html

本文链接：https://blog.csdn.net/Outsider07/article/details/115303721

版权

本文介绍了如何使用Django框架配合MySQL数据库，实现用户注册和登录功能的改良版。首先，在app01的models中定义模型类，并进行数据库迁移。接着配置Django的settings以连接MySQL数据库。然后，创建HTML模板文件分别用于注册、登录和登录后的页面。最后，在views.py中更新注册和登录的视图逻辑。

摘要由CSDN通过智能技术生成

记得在app01下的models中搞定模型类
建立迁移文件：python manage.py makemigrations
根据迁移文件在指定数据库中生成表：python manage.py migrate
create database book character set utf8;创建数据库设置字符集编码

在settings里面设置mysql

‘default’: {
‘ENGINE’: ‘django.db.backends.mysql’,
‘NAME’: ‘books’, #你的数据库名称
‘USER’: ‘root’, #你的数据库用户名
‘PASSWORD’: ‘’, #你的数据库密码
‘HOST’: ‘’, #你的数据库主机，留空默认为localhost
‘PORT’: ‘3306’, #你的数据库端口
}

init连接mysql

import pymysql
pymysql.install_as_MySQLdb()

1.在templates中创建一个html文件用于简单的注册网页

  1 <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset="UTF-8">
  5     <title>注册</title>
  6        <style>
  7         * {
    
  8             margin: 0;
  9             padding: 0;
 10         }
 11 
 12         body {
    
 13             background-color: rgb(235, 235, 235);
 14         }
 15 
 16         form {
    
 17             width: 400px;
 18             height: 320px;
 19             background-color: white;
 20             padding: 20px;
 21             box-sizing: border-box;
 22             position: absolute;
 23             left: 50%;
 24             top: 50%;
 25             transform: translate(-50%, -50%);
 26             /* 相对于现在所处位置的位移变化，x便偏移自己宽度的50%，y偏移自己高度的50% */
 27         }
 28 
 29         h2 {
    
 30             margin-bottom: 20px;
 31             text-align: center;
 32         }
 33 
 34         form input {
    
 35             width: 100%;
 36             height: 30px;
 37             display: block;
 38             margin-bottom: 20px;
 39             padding-left: 10px;
 40             box-sizing: border-box;
 41         }
 42 
 43         .mya {
    
 44             width: 100%;
 45             height: 30px;
 46             margin-bottom: 20px;
 47         }
 48 
 49         .mya a:nth-child(1) {
    
 50             float: left;
 51         }
 52 
 53         .mya a:nth-child(2) {
    
 54             float: right;
 55         }
 56 
 57         button {
    
 58             width: 100%;
 59             height: 40px;
 60             background-color: rgb(235, 235, 235);
 61             border: none;
 62         }
 63 
 64         button:active {
    
 65             box-shadow: 0 0 3px rgb(173, 172, 172);
 66             /* x偏移  y偏移  模糊值 颜色 */
 67         }
 68     </style>
 69 </head>
 70 <body>
 71     <form  method="post">
 72         <h2>注册界面</h2>
 73         <input id="username" type="text" placeholder="请输入账号" name="usernamekey">
 74         <input id="password" type="password" placeholder="请输入密码" name="passwordkey">
 75         <div class="mya">
 76             <a href="http://127.0.0.1:8000/sign"