goframe开发一个企业网站 在vue-next-admin 显示验证码 19

index.go 文件中的代码,我将为该文件中的主要功能和方法添加注释,并生成一篇 Markdown 格式的文章。这将包括对每个函数的用途、输入参数和返回值的简要说明。

index.go

在这里插入图片描述

包和导入
package admin

import (
	"context"
	"errors"
	"gf_new_web/api/common"
	"gf_new_web/internal/service"

	"github.com/gogf/gf/v2/frame/g"
)
  • 包名: admin
  • 导入说明:
    • context: 用于传递请求上下文。
    • errors: 用于处理错误。
    • gf_new_web/api/commongf_new_web/internal/service: 项目内部的 API 和服务层。
    • github.com/gogf/gf/v2/frame/g: GoFrame 框架的核心包。
登录功能
func (c *cIndex) Login(ctx context.Context, req *common.UserLoginReq) (*common.ReturnJsRes, error) {
	g.Log().Info(ctx, "收到登录请求", req)
	loginRes, err := service.User().Login(ctx, req)
	if err != nil {
		return nil, err
	}
	r := g.RequestFromCtx(ctx)
	loginRes.Msg = "登录成功"
	r.Response.WriteJson(loginRes)

	return loginRes, nil
}
  • 功能: 处理用户登录请求。
  • 参数:
    • ctx: 请求的上下文。
    • req: 用户登录请求的详细信息。
  • 返回:
    • *common.ReturnJsRes: 登录操作的结果。
    • error: 错误信息。
注册功能
func (c *cIndex) Reg(ctx context.Context, req *common.UserRegisterReq) (*common.ResultRes[int64], error) {
	g.Log().Info(ctx, "收到注册请求", req)
	registerRes, err := service.User().Register(ctx, req)
	if err != nil {
		return nil, err
	}
	r := g.RequestFromCtx(ctx)
	r.Response.WriteJson(registerRes)
	return registerRes, nil
}
  • 功能: 处理用户注册请求。
  • 参数:
    • ctx: 请求的上下文。
    • req: 用户注册请求的详细信息。
  • 返回:
    • *common.ResultRes[int64]: 注册操作的结果。
    • error: 错误信息。
获取用户信息
func (c *cIndex) GetInfo(ctx context.Context, req *common.UserInfoReq) (*common.ReturnJsRes, error) {
	g.Log().Info(ctx, "收到获取用户信息请求", req)
	infoRes, err := service.User().GetInfo(ctx, req)
	if err != nil {
		return nil, err
	}
	r := g.RequestFromCtx(ctx)
	infoRes.Msg = "获取用户信息成功"
	r.Response.WriteJson(infoRes)
	return infoRes, nil
}
  • 功能: 获取用户的详细信息。
  • 参数:
    • ctx: 请求的上下文。
    • req: 用户信息请求的详细信息。
  • 返回:
    • *common.ReturnJsRes: 用户信息。
    • error: 错误信息。
获取验证码
func (c *cIndex) GetCaptcha(ctx context.Context, req *common.CodeReq) (*common.ReturnJsRes, error) {
	g.Log().Info(ctx, "收到获取验证码请求", req)
	captchaId, base64Image := service.Captcha().Get()
	if captchaId == "" || base64Image == "" {
		return nil, errors.New("获取验证码失败")
	}
	return &common.ReturnJsRes{
		Code: 0,
		Msg:  "获取验证码成功",
		Data: g.Map{
			"captchaId": captchaId,
			"image":     base64Image,
		},
	}, nil
}
  • 功能: 生成并返回验证码。
  • 参数:
    • ctx: 请求的上下文。
    • req: 验证码请求的详细信息。
  • 返回:
    • *common.ReturnJsRes: 验证码信息。
    • error: 错误信息。
      启动的端口为8555

vue-next-admin 中的相关配置 :

在这里插入图片描述
改为对应的端口。
api中进行改变:
在这里插入图片描述

import request from '/@/utils/request';

/**
 * (不建议写成 request.post(xxx),因为这样 post 时,无法 params 与 data 同时传参)
 *
 * 登录api接口集合
 * @method signIn 用户登录
 * @method signOut 用户退出登录
 */
export function useLoginApi() {
	return {
		signIn: (data: object) => {
			return request({
				url: '/admin/login',
				method: 'post',
				data,
			});
		},

		getCode: () => {
			return request({
				url: '/admin/code',
				method: 'get'
			});
		},


		signOut: (data: object) => {
			return request({
				url: '/admin/signOut',
				method: 'post',
				data,
			});
		},
	};
}

界面进行引入验证码:
在这里插入图片描述

相关代码:

以下是从您提供的文件中提取的 getLoginCodeonSignIn 函数的详细说明:

getLoginCode 函数

这个函数负责异步获取登录验证码。它首先尝试调用登录API的 getCode 方法来获取验证码。如果成功,它会更新状态中的 captchaImgcaptchaId。如果失败,它会捕获错误并显示错误消息。

const getLoginCode = async () => {
    try {
        const res = await useLoginApi().getCode();
        if (res.data.data) {
            state.captchaImg = res.data.data.image;
            state.ruleForm.captchaId = res.data.data.captchaId;
        } else {
            throw new Error('验证码数据格式错误');
        }
    } catch (error: any) {
        ElMessage.error(error?.message || '获取验证码失败');
    }
};

onSignIn 函数

这个函数处理用户的登录操作。它首先验证用户输入的手机号和密码格式是否正确。如果格式验证失败,将显示相应的错误消息。如果格式验证成功,它将尝试通过API进行登录。登录成功后,会根据配置决定初始化前端或后端路由,并处理登录成功后的跳转和状态更新。如果登录失败,它会显示错误消息并重新获取验证码。

const onSignIn = async () => {
    state.loading.signIn = true;
    try {
        if (!verifyPhone(state.ruleForm.userName)) {
            ElMessage.error('手机号格式错误');
            return;
        }
        if (!verifyPasswordLengthNoSpaces(state.ruleForm.password)) {
            ElMessage.error('密码格式错误');
            return;
        }
        const res = await useLoginApi().signIn({
            username: state.ruleForm.userName,
            password: state.ruleForm.password,
            code: state.ruleForm.code,
        });

        if (res.code === 200) { // 假设200是成功状态码
            Session.set('token', res.data.token);
            Cookies.set('userName', state.ruleForm.userName);

            let isNoPower;
            if (!themeConfig.value.isRequestRoutes) {
                isNoPower = await initFrontEndControlRoutes();
            } else {
                isNoPower = await initBackEndControlRoutes();
            }
            signInSuccess(isNoPower);
        } else {
            ElMessage.error(res.msg || '登录失败');
            getLoginCode();
        }
    } catch (error) {
        ElMessage.error('登录失败,请重试');
        getLoginCode();
    } finally {
        state.loading.signIn = false;
    }
};

这两个函数是登录流程的核心部分,处理验证码获取和用户身份验证的逻辑。

在这里插入图片描述

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

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

相关文章

数据库的联合查询

数据库的联合查询 简介为什么要使⽤联合查询多表联合查询时MYSQL内部是如何进⾏计算的构造练习案例数据案例:⼀个完整的联合查询的过程 内连接语法⽰例 外连接语法 ⽰例⾃连接应⽤场景示例表连接练习 ⼦查询语法单⾏⼦查询多⾏⼦查询多列⼦查询在from⼦句中使⽤⼦查…

Oracle 23ai 对应windows版本安装配置PLSQL导入pde文件navicat连接Oracle

因为有一个pde文件需要查看里面的数据,所以这次需要配置本地oracle数据库,并且导入数据,因为还有navicat,所以就想用navicat去连接查看。 1、找到官网。 Get Started with Oracle Database 23ai | Oracle 2、下载windows版本。…

Juc01_多线程概述、四种实现方式、常用方法API、生命周期、买票案例、synchronized锁

目录 本章讲述内容:多线程概述、四种实现方式、常用方法API、生命周期、买票案例、synchronized锁 ①. 多线程的概述 ②. 多线程的实现方式 ①. 继承Thread ②. 实现Runnable接口 ③. Callable接口(创建线程) ④. 线程池 ③. 设置和获取线程名称 ④. 线程…

一个高度可扩展的 Golang ORM 库【GORM】

GORM 是一个功能强大的 Golang 对象关系映射(ORM)库,它提供了简洁的接口和全面的功能,帮助开发者更方便地操作数据库。 1. 完整的 ORM 功能 • 支持常见的关系模型: • Has One(一对一) • …

ubuntu24挂载硬盘记录

1、显示硬盘及所属分区情况。在终端窗口中输入如下命令: sudo fdisk -l 找到自己硬盘的分区 我的地址/dev/sda 2、显示硬盘及所属分区情况。在终端窗口中输入如下命令,格式化自己硬盘: sudo mkfs -t ext4 /dev/sda 3、在终端窗口中输入如下…

Flink四大基石之Window

为什么要用WIndow 在流处理应用中,数据是连续不断的,有时我们需要做一些聚合类的处理,例如:在过去的1分钟内有多少用户点击了我们的网页。 在这种情况下,我们必须定义一个窗口(window),用来收集最近1分钟内…

使用ENSP实现默认路由

一、项目拓扑 二、项目实现 1.路由器AR1配置 进入系统试图 sys将路由器命名为R1 sysname R1关闭信息中心 undo info-center enable 进入g0/0/0接口 int g0/0/0将g0/0/0接口IP地址配置为2.2.2.1/24 ip address 2.2.2.1 24进入g0/0/1接口 int g0/0/1将g0/0/1接口IP地址配置为1.…

《基于FPGA的便携式PWM方波信号发生器》论文分析(三)——数码管稳定显示与系统调试

一、论文概述 基于FPGA的便携式PWM方波信号发生器是一篇由任青颖、庹忠曜、黄洵桢、李智禺和张贤宇 等人发表的一篇期刊论文。该论文主要研究了一种新型的信号发生器,旨在解决传统PWM信号发生器在移动设备信号调控中存在的精准度低和便携性差的问题 。其基于现场可编…

vue 预览pdf 【@sunsetglow/vue-pdf-viewer】开箱即用,无需开发

sunsetglow/vue-pdf-viewer 开箱即用的pdf插件sunsetglow/vue-pdf-viewer, vue3 版本 无需多余开发,操作简单,支持大文件 pdf 滚动加载,缩放,左侧导航,下载,页码,打印,文本复制&…

1-golang_org_x_crypto_bcrypt测试 --go开源库测试

1.实例测试 package mainimport ("fmt""golang.org/x/crypto/bcrypt" )func main() {password : []byte("mysecretpassword")hashedPassword, err : bcrypt.GenerateFromPassword(password, bcrypt.DefaultCost)if err ! nil {fmt.Println(err)…

嵌入式的C/C++:深入理解 static、const 与 volatile 的用法与特点

目录 一、static 1、static 修饰局部变量 2、 static 修饰全局变量 3、static 修饰函数 4、static 修饰类成员 5、小结 二、const 1、const 修饰普通变量 2、const 修饰指针 3、const 修饰函数参数 4. const 修饰函数返回值 5. const 修饰类成员 6. const 与 #defi…

超高流量多级缓存架构设计!

文章内容已经收录在《面试进阶之路》,从原理出发,直击面试难点,实现更高维度的降维打击! 文章目录 电商-多级缓存架构设计多级缓存架构介绍多级缓存请求流程负载均衡算法的选择轮询负载均衡一致性哈希负载均衡算法选择 应用层 Ngi…

【C++ 算法进阶】算法提升二十三

目录 左右数组相减绝对值最大值 (题意代换)题目题目分析 可整合数组 (题意代换)题目题目分析代码 水王问题题目题目分析代码水王问题变形思路讲解 合并石头的最低成本 (动态规划)题目题目分析代码 左右数组…

solr 远程命令执行 (CVE-2019-17558)

漏洞描述 Apache Velocity是一个基于Java的模板引擎,它提供了一个模板语言去引用由Java代码定义的对象。Velocity是Apache基金会旗下的一个开源软件项目,旨在确保Web应用程序在表示层和业务逻辑层之间的隔离(即MVC设计模式)。 Apa…

idea怎么打开两个窗口,运行两个项目

今天在开发项目的时候,前端希望运行一下以前的项目,于是就需要开两个 idea 窗口,运行两个项目 这里记录一下如何设置:首先依次点击: File -> Settings -> Appearance & Behavior ->System Settings 看到如…

PPT分享 | IBM集团业务流程架构顶层规划-订单到交付-销售到回款方案

PPT下载链接见文末~ IBM业务流程规划方法是一套结构化、体系化的流程设计理论,其企业流程框架(EPF)是一种用于企业业务流程架构设计梳理的方法论。 一、IBM业务流程规划方法的核心 IBM的BPM(业务流程管理)流程管理体…

MySQL闪回恢复:轻松应对数据误删,数据安全有保障

在数据库管理中,数据误删是一个常见且棘手的问题。传统的数据恢复方法可能涉及复杂的操作,如全量备份和增量备份的恢复。MySQL的闪回恢复功能提供了一种更为简便、高效的数据恢复手段。本文将详细介绍MySQL闪回恢复的原理、配置和使用方法,帮…

加菲工具 - 好用免费的在线工具集合

加菲工具 https://orcc.online AI 工具 加菲工具 集合了目前主流的,免费可用的ai工具 文档处理 加菲工具 pdf转word、office与pdf互转等等工具都有链接 图片图标 加菲工具 统计了好用免费的在线工具 编码解码 加菲工具 base64编码解码、url编码解码、md5计算…

uniapp跨域问题解决方案

uniapp跨域问题解决方案 引言 在使用 uni-app 本地开发 H5> 平台时,需要使用浏览器进行调试,而浏览器会有跨域的问题。比如直接通过本地IP地址去访问开发中的页面,同时这个页面会调一些现有的接口时,就面临着跨域的问题。 解决…

ensp静态路由实验

一、实验目的 1、熟练掌握交换机的基本配置命令 2、熟练掌握静态路由的使用方法 3. 熟练掌握交换机端口模式 二、实验内容 需求: 根据要求利用现有实验设备组建小型局域网 实验设备: 交换机S37002台;PC机2台;路由器2台。 …