Go语言实现用户登录Web应用

文章目录

  • 1. Go语言Web框架
    • 1.1 框架比较
    • 1.2 安装Gin框架
  • 2. 实现用户登录功能
    • 2.1 创建项目目录
    • 2.2 打开项目目录
    • 2.3 创建登录Go程序
    • 2.4 创建模板页面
      • 2.4.1 登录页面
      • 2.4.2 登录成功页面
      • 2.4.3 登录失败页面
  • 3. 测试用户登录项目
    • 3.1 运行登录主程序
    • 3.2 访问登录页面
    • 3.3 演示登录成功
    • 3.4 演示登录失败
  • 4. 改进版 —— 引入数据库
    • 4.1 创建数据与表
    • 4.2 安装数据库驱动
    • 4.3 修改登录Go程序
      • 4.3.1 导入数据库相关包
      • 4.3.2 创建初始化函数
      • 4.3.3 创建登录函数
      • 4.3.4 修改登录处理器函数
    • 4.4 测试用户登录项目
      • 4.4.1 运行登录Go程序
      • 4.4.2 访问登录页面
      • 4.4.3 演示登录成功
      • 4.4.4 演示登录失败
  • 5. 实战总结

1. Go语言Web框架

1.1 框架比较

  • Gin框架以其高性能和简洁的API设计而闻名,适合构建RESTful API和Web应用。Echo框架则提供了更多的中间件支持和更灵活的路由配置。Beego框架则提供了一个全功能的解决方案,包括ORM、缓存、日志等。

1.2 安装Gin框架

  • 执行命令:go get -u github.com/gin-gonic/gin
    在这里插入图片描述
  • 查看是否安装成功,执行命令:go list github.com/gin-gonic/gin
    在这里插入图片描述

2. 实现用户登录功能

2.1 创建项目目录

  • go_work里创建login目录,然后在login里创建templates
    在这里插入图片描述

2.2 打开项目目录

  • 在VsCode里打开login目录
    在这里插入图片描述

2.3 创建登录Go程序

  • login目录里创建login.go
    在这里插入图片描述
package main

import (
    "net/http"
    "github.com/gin-gonic/gin"
    "path/filepath"  
    "log"   
)

func main() {
    // 创建一个带有默认中间件Logger和Recovery的Gin路由器实例
    router := gin.Default()    

    // 使用filepath.Glob获取所有.tmpl模板文件的路径
    tmplFiles, err := filepath.Glob("templates/*.tmpl")
    if err != nil {
        log.Fatal("Error reading templates: ", err)
    }

    // 加载模板文件
    router.LoadHTMLFiles(tmplFiles...)    
	
    // 显示登录页面
    router.GET("/", func(c *gin.Context) {
        c.HTML(http.StatusOK, "login.tmpl", nil)
    })

    // 处理登录请求
    router.POST("/login", loginHandler)

    // 成功页面路由
    router.GET("/success", func(c *gin.Context) {
        // 从查询参数中获取用户名
        username := c.Query("username")
        // 将用户名传递给模板
        c.HTML(http.StatusOK, "success.tmpl", gin.H{"username": username})
    })

    // 失败页面路由
    router.GET("/failure", func(c *gin.Context) {
        // 从查询参数中获取用户名
        username := c.Query("username")
        c.HTML(http.StatusOK, "failure.tmpl", gin.H{"username": username})
    })

    // 启动服务器
    router.Run(":8080")
}

// loginHandler 处理用户登录请求
func loginHandler(c *gin.Context) {
    // 获取表单数据
    username := c.PostForm("username")
    password := c.PostForm("password")

    // 假设的用户名和密码
    if username == "无心剑" && password == "903213" {        
        // 登录成功,跳转到success页面,并带查询参数
        c.Redirect(http.StatusFound, "success?username=" + username)
    } else {
        // 登录失败,跳转到failure页面,并带查询参数
        c.Redirect(http.StatusFound, "failure?username=" + username)
    }
}
  • 代码说明:这段Go代码使用Gin框架创建了一个简单的Web服务器,用于处理用户登录,并根据登录结果重定向到成功或失败页面。服务器在8080端口启动,提供三个路由:根路由(“/”)显示登录页面,“/login"处理登录逻辑,”/success"和"/failure"分别显示登录成功和失败的信息。登录成功后,用户名作为查询参数传递给成功页面的模板,失败页面同理。使用filepath.Glob获取所有模板文件并加载,模板文件存放在templates目录下。登录验证逻辑假设用户名为"无心剑",密码为"903213"。

2.4 创建模板页面

2.4.1 登录页面

  • templates里创建login.tmpl文件
    在这里插入图片描述
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>用户登录</title>
        <style>
            * {
                margin: 0;
                padding: 0;
                box-sizing: border-box;
            }

            body {
                font-family: Arial, sans-serif;
                background-color: #f5f5f5;
            }

            .container {
                max-width: 300px;
                margin: 50px auto;
                background-color: #ffffff;
                padding: 20px;
                border-radius: 5px;
                box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
            }

            h3 {
                text-align: center;
            }

            form {
                display: flex;
                flex-direction: column;
            }

            label {
                margin-top: 10px;
            }

            input[type="text"],
            input[type="password"] {
                width: 100%;
                padding: 8px;
                margin-top: 5px;
                border: 1px solid #ccc;
                border-radius: 3px;
            }

            button {
                width: 100%;
                padding: 10px;
                margin-top: 10px;
                background-color: #4CAF50;
                color: white;
                border: none;
                border-radius: 3px;
                cursor: pointer;
            }

            button:hover {
                background-color: #45a049;
            }        
        </style>
    </head>

    <body>
        <div class="container">
            <h3>用户登录</h3>
            <form action="login" method="POST">
                <input type="text" id="username" name="username" required placeholder="请输入用户名">
                <input type="password" id="password" name="password" required placeholder="请输入密码">
                <button type="submit">登录</button>            
            </form>
        </div>
    </body>
</html>

2.4.2 登录成功页面

  • templates里创建success.tmpl文件
    在这里插入图片描述
<html>
    <head>
        <title>登录成功</title>
        <style>
            .framed {
                border: 2px solid #000; /* 设置边框宽度、样式和颜色 */
                border-radius: 15px; /* 设置圆角边框 */
                padding: 10px; /* 设置内边距 */
                width: fit-content; /* 设置宽度为适合内容 */
                background-color: #f0f0f0; /* 设置背景颜色为浅灰色 */
                color: #f33; /* 设置文本颜色 */
                display: inline-block; /* 防止阴影和边框被裁剪 */
            }
            .centered {
                text-align: center; /* 使包含元素的文本居中 */
                margin-top: 50px; /* 添加上边距 */
                margin-bottom: 50px; /* 添加下边距 */
            }
        </style>
    </head>
    <body>
        <div class="centered">
            <h3 class="framed">恭喜,{{ .username }}登录成功~</h3>
        </div>
    </body>
</html>

2.4.3 登录失败页面

  • templates里创建failure.tmpl文件
    在这里插入图片描述
<html>
    <head>
        <title>登录失败</title>
        <style>
            .framed {
                border: 2px solid #000; /* 设置边框宽度、样式和颜色 */
                border-radius: 15px; /* 设置圆角边框 */
                padding: 10px; /* 设置内边距 */
                width: fit-content; /* 设置宽度为适合内容 */
                background-color: #f0f0f0; /* 设置背景颜色为浅灰色 */
                color: #33f; /* 设置文本颜色 */
                display: inline-block; /* 防止阴影和边框被裁剪 */
            }
            .centered {
                text-align: center; /* 使包含元素的文本居中 */
                margin-top: 50px; /* 添加上边距 */
                margin-bottom: 50px; /* 添加下边距 */
            }
        </style>
    </head>
    <body>
        <div class="centered">
            <h3 class="framed">遗憾,{{ .username }}登录失败~</h3>
        </div>
    </body>
</html>

3. 测试用户登录项目

3.1 运行登录主程序

  • 运行login.go程序
    在这里插入图片描述

3.2 访问登录页面

  • 访问http://localhost:8080/
    在这里插入图片描述

3.3 演示登录成功

  • 输入正确的用户名和密码
    在这里插入图片描述
  • 单击【登录】按钮,跳转到登录成功页面
    在这里插入图片描述

3.4 演示登录失败

  • 输入错误的用户名或密码
    在这里插入图片描述
  • 单击【登录】按钮,跳转到登录失败页面
    在这里插入图片描述

4. 改进版 —— 引入数据库

4.1 创建数据与表

  • 数据库testdb与表t_user
    在这里插入图片描述

4.2 安装数据库驱动

  • 执行命令:go get -u github.com/go-sql-driver/mysql
    在这里插入图片描述

4.3 修改登录Go程序

4.3.1 导入数据库相关包

  • 导入"database/sql"_ "github.com/go-sql-driver/mysql"
    在这里插入图片描述
  • 代码说明:“database/sql” 是Go标准库的一部分,用于数据库操作。而 _ “github.com/go-sql-driver/mysql” 这行代码的意思是导入 github.com/go-sql-driver/mysql 包,但不直接使用它的任何公开API。这样做的目的是让该包在程序启动时自动执行它的 init 函数。

4.3.2 创建初始化函数

  • 创建init()函数
    在这里插入图片描述
var db *sql.DB

func init() {
    var err error
    // 设置数据源
    dsn := "root:903213@tcp(127.0.0.1:3306)/testdb"
	// 打开数据库
    db, err = sql.Open("mysql", dsn)
    if err != nil {
        log.Fatal("Error connecting to the database: ", err)
    }
    if err = db.Ping(); err != nil {
        log.Fatal("Error pinging the database: ", err)
    }
}
  • 代码说明:这段代码初始化一个全局的*sql.DB数据库连接对象。init函数在程序启动时自动执行,用于设置数据库数据源(DSN),并尝试打开和测试数据库连接。如果连接失败,程序将记录错误并终止执行。这里使用的DSN包含了用户名、密码、地址和数据库名。确保在运行前数据库服务已启动,并且DSN配置正确。

4.3.3 创建登录函数

  • 创建login()函数
    在这里插入图片描述
func login(username, password string) bool {
	// 查询数据库中的用户信息
    var storedPassword string
    err := db.QueryRow("SELECT password FROM t_user WHERE username = ?", username).Scan(&storedPassword)
    if err != nil {
        log.Print("Error querying database: ", err)        
        return false
    }

    // 验证密码
    if password == storedPassword {
        return true
    } else {
        return false
    }
}

4.3.4 修改登录处理器函数

  • 修改loginHandler()函数代码
    在这里插入图片描述

4.4 测试用户登录项目

4.4.1 运行登录Go程序

  • 运行login.go程序
    在这里插入图片描述

4.4.2 访问登录页面

  • 访问http://localhost:8080/
    在这里插入图片描述

4.4.3 演示登录成功

  • 查看用户表
    在这里插入图片描述
  • 输入第二个用户信息:郑晓红11111
    在这里插入图片描述
  • 单击【登录】按钮,跳转到登录成功页面
    在这里插入图片描述

4.4.4 演示登录失败

  • 输入错误的用户名或密码:张三丰123456
    在这里插入图片描述
  • 单击【登录】按钮,跳转到登录失败页面
    在这里插入图片描述

5. 实战总结

  • 在本次实战项目中,我们成功地使用Go语言的Gin框架开发了一个具有数据库支持的用户登录系统。通过初始化项目结构、编写后端逻辑、设计前端页面,我们实现了一个完整的Web应用。我们学习了如何使用Gin框架处理HTTP请求、如何连接MySQL数据库以及如何使用模板渲染页面。此外,我们还掌握了如何通过查询参数在不同的页面间传递数据。这个项目不仅加深了我们对Web开发的理解,也锻炼了我们解决实际问题的能力。通过测试不同的登录场景,我们验证了系统的功能性和健壮性。总的来说,这是一个提高编程技能和学习新知识的宝贵经验。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/916316.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

2024算法基础公选课练习三(DFS1)(1)

一、前言 dfs是初学者的重点&#xff0c;也是难点&#xff0c;这次的有些题目也不好写。题目有点多&#xff0c;因此分成&#xff08;1&#xff09;和&#xff08;2&#xff09; 二、题目总览 三、具体题目 3.1 问题 A: 贪心——排队接水 思路 贪心&#xff0c;把接水时间短…

数据库参数备份

MySQL #!/bin/bash # 获取当前日期和时间的时间戳 TIMESTAMP$(date "%Y%m%d-%H%M%S")# 0、创建目录 mkdir /tmp/parameter_$TIMESTAMP/# 1、获取所有命名空间 echo "1、获取所有命名空间" NAMESPACES$(kubectl get ns | grep qfusion- | grep -v qfusion-…

Kconfig 知道的!与不知道的?

1 Kconfig 的重要性 Kconfig 是 Linux 内核配置系统的重要工具&#xff0c;它通过定义和管理配置选项&#xff0c;使开发者能够灵活地调整内核模块。无论是精简内核以适配嵌入式系统&#xff0c;还是为桌面应用扩展功能&#xff0c;Kconfig 都在其中扮演着关键角色。本文将带领…

CCI3.0-HQ:用于预训练大型语言模型的高质量大规模中文数据集

摘要 我们介绍了 CCI3.0-HQ&#xff0c;它是中文语料库互联网 3.0&#xff08;CCI3.0&#xff09;的一个高质量500GB子集&#xff0c;采用新颖的两阶段混合过滤管道开发&#xff0c;显著提高了数据质量。为了评估其有效性&#xff0c;我们在不同数据集的100B tokens上从头开始…

rhcsa笔记二

普通文件的创建 touch命令的使用 touch 文件名 &#xff08;文件路径&#xff09; linux不是用后缀区分文件类型的&#xff0c;而是用ll出现的第一个字符区分文件类型的 -&#xff1a;普通文件 d:目录文件 [rootserver ~]# stat /etc/hostname 文件&#xff1a;/etc/hos…

微澜:用 OceanBase 搭建基于知识图谱的实时资讯流的应用实践

本文作者&#xff1a; 北京深鉴智源科技有限公司架构师 郑荣凯 本文整理自北京深鉴智源科技有限公司架构师郑荣凯&#xff0c;在《深入浅出 OceanBase 第四期》的分享。 知识图谱是一项综合性的系统工程&#xff0c;需要在在各种应用场景中向用户展示经过分页的一度关系。 微…

探索Python文档自动化的奥秘:`python-docx`库全解析

文章目录 探索Python文档自动化的奥秘&#xff1a;python-docx库全解析1. 背景&#xff1a;为何选择python-docx&#xff1f;2. python-docx是什么&#xff1f;3. 如何安装python-docx&#xff1f;4. 简单库函数使用方法创建文档添加段落添加标题添加表格插入图片 5. 应用场景自…

测试实项中的偶必现难测bug--一键登录失败

问题描述:安卓和ios有出现部分一键登录失败的场景,由于场景比较极端,衍生了很多不好评估的情况。 产生原因分析: 目前有解决过多次这种行为的问题,每次的产生原因都有所不同,这边根据我个人测试和收集复现的情况列举一些我碰到的: 1、由于我们调用的是友盟的一键登录的…

Vue的基础使用

一、为什么要学习Vue 1.前端必备技能 2.岗位多&#xff0c;绝大互联网公司都在使用Vue 3.提高开发效率 4.高薪必备技能&#xff08;Vue2Vue3&#xff09; 二、什么是Vue 概念&#xff1a;Vue (读音 /vjuː/&#xff0c;类似于 view) 是一套 构建用户界面 的 渐进式 框架…

vue3使用VueQuill插入自定义按钮

在 Vue 3 项目中使用 VueQuill 编辑器时&#xff0c;我们可以自定义内容来满足特定的需求。本文将介绍如何在 VueQuill 中插入自定义内容&#xff0c;比如插入特定的标签或样式元素。 Quill官方中文文档 1. 项目设置和依赖安装 如果你还没有创建 Vue 3 项目&#xff0c;可以…

【springboot使用sqlite数据库】Java后台同时使用mysql、sqlite

环境&#xff1a;根据业务的需要&#xff0c;老版程序使用的数据库是sqlite&#xff0c;版本升级成前后台分离模式&#xff0c;因此需要兼容mysql与sqlite数据库同时使用。 pom.xml设置&#xff1a; application.yml文件配置&#xff1a; mapper.java文件&#xff1a; service.…

多智能体深度确定性策略梯度(MADDPG)算法复现教程

复现软硬件: Ubunru20.04,Python 3.8.10, torch 2.4.1, gym 0.10.5,VScode 论文: http://arxiv.org/pdf/1706.02275 环境: GitHub - openai/multiagent-particle-envs: Code for a multi-agent particle environment used in the paper "Multi-Agent Actor-…

51c大模型~合集42

我自己的原文哦~ https://blog.51cto.com/whaosoft/11859244 #猎户座 「草莓」即将上线&#xff0c;OpenAI新旗舰大模型曝光&#xff0c;代号「猎户座」 ChatGPT 要进化了&#xff1f; 本月初&#xff0c;OpenAI 创始人、CEO 山姆・奥特曼突然在 X 上发了一张照片&#xff0…

探索Copier:Python项目模板的革命者

文章目录 **探索Copier&#xff1a;Python项目模板的革命者**1. 背景介绍&#xff1a;为何Copier成为新宠&#xff1f;2. Copier是什么&#xff1f;3. 如何安装Copier&#xff1f;4. 简单库函数使用方法4.1 创建模板4.2 从Git URL创建项目4.3 使用快捷方式4.4 动态替换文本4.5 …

系统掌握大语言模型提示词 - 从理论到实践

以下是我目前的一些主要个人标签&#xff1a; 6 年多头部大厂软件开发经验&#xff1b;1 年多 AI 业务应用经验&#xff0c;拥有丰富的业务提示词调优经验和模型微调经验。信仰 AGI&#xff0c;已经将 AI 通过自定义 Chatbot /搭建 Agent 融合到我的工作流中。头部大厂技术大学…

前端学习资源合集,附链接

前言 本文是前端开发初学资源 初步 1. 三件套htmlcssjavascript 前端Web开发HTML5CSS3移动web视频教程&#xff0c;前端web入门首选黑马程序员_哔哩哔哩_bilibili 黑马程序员前端JavaScript入门到精通全套视频教程&#xff0c;javascript核心进阶ES6语法、API、js高级等基…

全同态加密基于多项式环计算的图解

全同态加密方案提供了一种惊人的能力 —— 能够在不知道数据具体内容的情况下对数据进行计算。这使得你可以在保持潜在敏感源数据私密的同时&#xff0c;得出问题的答案。 这篇文章的整体结构包括多项式环相关的数学介绍&#xff0c;基于多项式环的加密和解密是如何工作的&…

【Window主机访问Ubuntu从机——Xrdp配置与使用】

使用Xrdp在Window环境下远程桌面访问Ubuntu主机 文章目录 Ubuntu安装图形化界面Ubuntu安装Xrdp通过网线连接两台主机Window主机有线连接配置Ubuntu从机设置测试有线连接 Window主机打开远程桌面功能参考文章总结 Ubuntu安装图形化界面 sudo apt update sudo apt upgrade sudo …

stable-diffusion-3 ,每天免费试用

https://huggingface.co/spaces/stabilityai/stable-diffusion-3-mediumhttps://huggingface.co/spaces/stabilityai/stable-diffusion-3-medium官方space&#xff0c;童叟无欺&#xff0c;科学试用。 an image of a girl with white hair, in the style of ross tran, light …

datastage在升级版本到11.7之后,部分在11.3上正常执行的SP报错SQLSTATE = 22007: 本机错误代码 = -180

在升级版本到11.7之后&#xff0c;部分在11.3上正常执行的SP开始报错&#xff0c;报的SQL错误是时间参数问题&#xff0c;但是一样的SP可以直接call sp执行&#xff0c;也可以手动调用作业执行&#xff0c;只有设置定时调度时作业会报错&#xff0c; CALLXXX.XXX(1,CURRENT TIM…