[pig框架实战] 手撕视频管理发布平台[02] - pig框架源码分析（去除开发过程中每次输入验证码的过程，方便快速登录）

需求

将自己搭建好的项目添加到pig项目中
去除开发过程中每次输入验证码的过程，方便快速登录
- 去除验证码校验（服务器端）
- 去除验证码校验（前端）

将自己搭建好的项目myvideos添加到pig项目中

File -> New ->《 Module from Existing Sources…》
指定目录
下一步->下一步
效果

去除开发过程中每次输入验证码的过程，方便快速登录

去除验证码校验（服务器端）

定位校验代码步骤

前端请求url：http://localhost:8080/auth/oauth/token
localhost:8080是前端node启动的服务，在vue.config.js文件中的末尾，可以得知url请求为配置转发代理的http://pig-gateway:9999
pig-gateway为路由转发模块，通过nacos查看配置文件，可以得知**/oauth/路径由pig-auth项目处理；但是下发的过滤器标明了验证码处理是由ValidateCodeGatewayFilter.java**完成的。
查看，不校验验证码，直接返回即可。最终修改代码如下：

@SneakyThrowsprivate void checkCode(ServerHttpRequest request) {return;}

去除验证码校验（前端）

默认登录页面没有输入验证码，报错提示验证码不能为空，如下图所示：

也就是说，我们给验证码一个默认值就可以了。

那么怎么定位这个页面在哪里呢？我们通过登录页面的错误提示信息“请输入验证码”，在整个前端项目中搜索该关键字，发现下图两处vue文件有该值。

阅读两个文件，不难发现userlogin.vue是用户名密码登录的页面，而codelogin.vue则是手机号登录的方式。

直接将验证码对应的对象this.loginForm.code进行赋值即可完成任务，代码如下：

export default {name: "userlogin",data() {return {loginForm: {username: "admin",password: "123456",code: "",             // 这里赋值是没有用的！！！randomStr: ""},// 页面加载完成created函数会被调用，this.refreshCode();该方法会初始化this.loginForm.code值// 所以应该在refreshCode()中将this.loginForm.code设置任意不为空的字符即可！！！created() {this.refreshCode();},computed: {...mapGetters(["tagWel"])},methods: {refreshCode() {// 赋值操作this.loginForm.code = "1";this.loginForm.randomStr = randomLenNum(this.code.len, true);this.code.type === "text"? (this.code.value = randomLenNum(this.code.len)): (this.code.src = `${this.codeUrl}?randomStr=${this.loginForm.randomStr}`);},

参考资料

创建微服务项目骨架
本文章后台代码 https://gitee.com/constellations/pig
本文章前端代码 https://gitee.com/constellations/pig-ui
作者QQ：6307840

[pig框架实战] 手撕视频管理发布平台[02] - pig框架源码分析（去除开发过程中每次输入验证码的过程，方便快速登录）相关推荐

[pig框架实战] 手撕视频管理发布平台[08] - 自动化发布视频到微信视频号上
文章目录自动化发布视频到视频号上前端代码实现后台代码实现自动化实现(python+selenium) 参考资料自动化发布视频到视频号上前端代码实现在上一节,我们已经写好了发布按钮的界面, ...
[pig4cloud框架源码分析] 03 - MyBatis中的sql语句日志打印
文章目录导读 pig4cloud框架配置 Mybatis Log Plugin 插件开启方式插件说明 [TODO]源码分析拦截器方案实现sql日志查看参考资料导读使用MyBatis开发过程 ...
jsp+ssm计算机毕业设计短视频文案创作平台系统【附源码】
项目运行环境配置: Jdk1.8 + Tomcat7.0 + Mysql + HBuilderX(Webstorm也行)+ Eclispe(IntelliJ IDEA,Eclispe,MyEclis ...
二进制安全：ptmalloc内存管理机制与堆块chunk源码分析
敬告: <中华人民共和国刑法>第三百八十六条[破坏计算机系统罪:网络服务渎职罪]违反国家规定,对计算机信息系统功能进行删除.修改.增加.干扰,造成计算机系统不能正常运行,后果严重的,处五年 ...
短视频、直播平台——电商直播源码第三方SDK接入教程
现在网络视频直播行业非常火爆,所以很多公司也希望开发直播平台,一般直播平台需要用户给主播送礼物来实现盈利,所以刷礼物的功能是必备的,另外为了增加视频的美感与炫酷等特效功能,也需要用到美颜与视频滤镜等功 ...
手撕HashMap数据结构（带你逐行阅读源码）
目录概述原理简述新旧版本对比结构设计原理继承关系成员变量核心:为什么负载因子设定为0.75? 核心:为什么树化的链表阈值是8? 核心:为什么树退化的链表阈值是6? 构造函数默认构造方法 ...
redis 发布订阅实际案例_Redis源码分析之发布订阅+慢查询+排序以及监视器
发布订阅发布订阅就是一个经典的观察者模式,其中通道是指channel字符串本身,而模式是指正则表达式,进行匹配.结合Redis设计与实现一书数据结构基本数据结构在client对象中,分别记录了 ...
图片加载框架Picasso －源码分析
简书:图片加载框架Picasso - 源码分析前一篇文章讲了Picasso的详细用法,Picasso 是一个强大的图片加载缓存框架,一个非常优秀的开源库,学习一个优秀的开源库,,我们不仅仅是学习它的 ...
Java集合类框架源码分析之 LinkedList源码解析【4】
上一篇介绍了ArrayList的源码分析[点击看文章],既然ArrayList都已经做了介绍,那么作为他同胞兄弟的LinkedList,当然必须也配拥有姓名! Talk is cheap,show m ...