Idea中maven项目实现登录验证码功能

1、配置maven环境变量,将maven安装的bin⽬录添加到path路径中(此电脑->属性->高级系统设置->环境变量->)

路径为maven安装目录

2、找到ValidateCode.jar包的本地路径

3、制作Jar包

原jar包地址:链接: https://pan.baidu.com/s/1QpqiZaF_ZYhW1Qn3ifn2eg 提取码: uc47

无法直接使用,需要命令行制作,命令如下:

mvn install:install-file -DgroupId=it.source
-DartifactId=ValidateCode -Dversion=1.0
-Dpackaging=jar -Dfile=C:\Users\xiyang\Desktop\ValidateCode-1.0.jar

‘C:\Users\xiyang\Desktop\ValidateCode-1.0.jar'为jar包路径

4、成功效果

5、在maven项目的pom.xml文件中添加依赖

<dependency>
<groupId>cn.dsna.util.images</groupId>
<artifactId>ValidateCode</artifactId>
<version>1.0</version>
</dependency>

注意:‘cn.dsna.util.images'为依赖的路径,笔者是将jar包放在本地maven仓库的cn/dsna/util/images路径下

6、前端html实现

<!DOCTYPE html>
<html class="loginHtml" lang="cn" xmlns:th="http://www.thymeleaf.org">
<head>
 <meta charset="utf-8">
 <title>后台登录</title>
 <meta name="renderer" content="webkit">
 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 <meta name="apple-mobile-web-app-status-bar-style" content="black">
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="format-detection" content="telephone=no">

 <link rel="icon" href="img/ico.ico" rel="external nofollow" >
 <link rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" media="all" />
 <link rel="stylesheet" href="css/public.css" rel="external nofollow" media="all" />
</head>
<body class="loginBody">
 <form class="layui-form" >
 <div class="login_face"><img src="" class="userAvatar" style="width: 100%;height: 100%"></div>
 <div class="layui-form-item input-item">
  <label for="userName">用户名</label>
  <input type="text" placeholder="请输入用户名" autocomplete="off" id="username" name="username" class="layui-input" lay-verify="required">
 </div>
 <div class="layui-form-item input-item">
  <label for="password">密码</label>
  <input type="password" placeholder="请输入密码" autocomplete="off" id="password" name="password" class="layui-input" lay-verify="required">
 </div>
 <div class="layui-form-item input-item" id="imgCode">
  <label for="code">验证码</label>
  <input type="text" placeholder="请输⼊验证码" autocomplete="off" id="code" name="code" class="layui-input">
  <img src="http://localhost:8080/home/code" onclick="changeCode()" id="codeImg">
 </div>
 <div class="layui-form-item">
  <button class="layui-btn layui-block" lay-filter="login" lay-submit>登录</button>
 </div>
 </form>

</body>

<script type="text/javascript" src="layui/layui.js"></script>
<script type="text/javascript" src="js/login.js"></script>
</html>

注意:页面是layui框架渲染的,layui官网: https://www.layui.com/

也可以在网盘中下载:链接: https://pan.baidu.com/s/1QpqiZaF_ZYhW1Qn3ifn2eg 提取码: uc47

7、前端js代码(login.js)

//点击验证码进⾏刷新验证码,(登陆失败以后,重新调⽤该⽅法去刷新验证码)
function changeCode(){
 var img = document.getElementById("codeImg");
 //注意:如果请求⽹址完全相同 则浏览器不会帮你刷新
 //可以拼接当前时间 让每次请求的⽹址都不⼀样
 img.src ="http://localhost:8080/home/code?time="+new Date().getTime();
 }

8、后端java代码(控制层)

//获取验证码
 @GetMapping("code")
 public void getCode(HttpServletRequest request, HttpServletResponse response){
//参数列表:宽度,⾼度,字符数,⼲扰线数量
 ValidateCode vs = new ValidateCode(120,40,5,100);
 //获取文本
 //String code = vs.getCode();
 //将文本放入session中,一个公共的存储空间,存值的方式是key-value
 try {
 request.getSession().setAttribute("code",vs.getCode());
 request.getSession().setMaxInactiveInterval(300);//永不过期为-1
 vs.write(response.getOutputStream());
 } catch (IOException e) {//有io流就可能有io流异常,就要加try catch语句
 e.printStackTrace();
 }
 }

9、最终效果

点击验证码自动刷新

到此这篇关于Idea中maven项目实现登录验证码功能的文章就介绍到这了,更多相关Idea maven登录验证码内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • 解决 IDEA 2020.2 reading pom.xml 卡死问题

    一.解决方案搜寻 刚出 IDEA 2020.2 版本的时候,当时第一时间更新了.打开公司的项目,没啥问题,但是当打开自己的项目的时候,就会看到右下角显示 reading pom.xml 然后就卡死了.很多次都这样,后来就回滚了 2020.1,直到今天才来再次尝试发现原因和解决方案. 1.1 导致原因的设定 如果有幸点进了 setting 中的 Maven 选项卡,那么可以看到 "Maven home dictionary" 也就是自定义的本地 Maven 路径被改成了 C:\Users

  • IDEA简单实现登录注册页面

    application.yml spring: datasource: username: root password: 123456 url: jdbc:mysql://localhost:3306/bd1906?serverTimezone=GMT%2B8 driver-class-name: com.mysql.cj.jdbc.Driver server: port: 8080 Controller层 @Controller public class loginController { @

  • IDEA实现 springmvc的简单注册登录功能的示例代码

    1.基本环境搭建 spring简介 SpringMVC框架是以请求为驱动,围绕Servlet设计,将请求发给控制器,然后通过模型对象,分派器来展示请求结果视图.其中核心类是DispatcherServlet,它是一个Servlet,顶层是实现的Servlet接口. project创建 在图中填上项目名称即可,其他直接next 如上图所示,创建两个包,并且指定包的类型,如下图,java包指定为Sources Root,resouces包指定为Resources root 整个目录结构: pom依赖

  • 如何利用IDEA搭建SpringBoot项目整合mybatis实现简单的登录功能

    利用闲余时间想自己搭建一个springboot+mybatis的项目,提升一下自己对项目的了解,毕竟自己还是一个小白,在这里为自己创建项目的过程做一个记录,以便以后回忆.同时将搭建中遇到的问题也在这里做记录.如有遇到同样问题的同学,希望能给你一下借鉴. springboot的优势之一就是快速搭建项目,省去了自己导入jar包和配置xml的时间,使用非常方便. 一,搭建项目: 1.打开IDEA,点击File→New→Project...,如图1所示 图1  搭建项目 2.当我们选择project..

  • Idea中maven项目实现登录验证码功能

    1.配置maven环境变量,将maven安装的bin⽬录添加到path路径中(此电脑->属性->高级系统设置->环境变量->) 路径为maven安装目录 2.找到ValidateCode.jar包的本地路径 3.制作Jar包 原jar包地址:链接: https://pan.baidu.com/s/1QpqiZaF_ZYhW1Qn3ifn2eg 提取码: uc47 无法直接使用,需要命令行制作,命令如下: mvn install:install-file -DgroupId=it.s

  • Django中使用pillow实现登录验证码功能(带刷新验证码功能)

    首先在项目里建立common目录,编写验证码的函数 verification_code.py import random from PIL import Image, ImageFont, ImageDraw def get_code(): mode = 'RGB' bg_width = 180 #这个是验证码那个框框的宽度 bg_height = 30 #这个是验证码那个框框的高度 bg_size = (bg_width, bg_height) bg_color = (255, 255, 25

  • Google Kaptcha 框架实现登录验证码功能(SSM 和 SpringBoot)

    一.效果图: 二.导入 jar 包 1.由于这是大神写好封装起来的一个框架,所有我们使用前得先下载相关的 jar 包 第一种:maven <!-- 验证码 --> <!-- https://mvnrepository.com/artifact/com.github.penggle/kaptcha --> <dependency>     <groupId>com.github.penggle</groupId>     <artifactI

  • SSM 实现登录验证码功能(附源码)

    如果想用框架来实现验证码,可以看我的另外一篇: Kaptcha 框架的使用很简单的.新手必备. https://www.jb51.net/article/152260.htm 一.效果图 二.实现代码 第一步:先建一个 RandomValidateCode.java 作为工具类.把下面的代码直接复制粘贴即可. package com.utils; import java.awt.Color; import java.awt.Font; import java.awt.Graphics; impo

  • 解决idea中maven项目无端显示404错误的方法

    问题描述: 有时我们会发现idea中创建的maven项目老是显示项目路径找不到,自己反复检查代码也没发现错误,如何你项目的web.xml是直接由idea默认创建的,而你的头文件又是后来直接用3.1或者更高的版本(推荐3.1版本)覆盖的原来的头文件,那我这篇博客就对你有帮助了. 问题原因: 当我们idea使用maven创建web项目时,idea默认提供的web.xml非常古老,功能不完善.如果我们只是单纯替换其头文件的话是没有用的,idea中web.xml的配置还是没有变. 如何解决: 1.将原来

  • java实现登录验证码功能

    本文实例为大家分享了java实现登录验证码功能的具体代码,供大家参考,具体内容如下 登录验证码 登录验证是大多数登录系统都会用到的一个功能,它的验证方式也是有很多种,例如登录验证码,登录验证条及拼图拖动块等,这里讲讲输入登录验证码的方式来实现的例子.首先,kaptcha这是一个开源的验证码实现库,利用这个库可以非常方便的实现验证码功能. 1.添加依赖 在pom文件下添加kaptcha依赖包 <!-- https://mvnrepository.com/artifact/com.github.ax

  • Spring Boot实现登录验证码功能的案例详解

    目录 验证码的作用 案例要求 前端页面准备 准备login.html页面 随机验证码工具类 后端控制器 验证码的作用 验证码的作用:可以有效防止其他人对某一个特定的注册用户用特定的程序暴力破解方式进行不断的登录尝试我们其实很经常看到,登录一些网站其实是需要验证码的,比如牛客,QQ等.使用验证码是现在很多网站通行的一种方式,这个问题是由计算机生成并且评判的,但是必须只有人类才能解答,因为计算机无法解答验证码的问题,所以回答出问题的用户就可以被认为是人类.验证码一般用来防止批量注册. 案例要求 验证

  • Java中SSM+Shiro系统登录验证码的实现方法

     先给大家展示下效果图: 1.验证码生成类: import java.util.Random; import java.awt.image.BufferedImage; import java.awt.Graphics; import java.awt.Font; import java.awt.Color; /** * 验证码生成器类,可生成数字.大写.小写字母及三者混合类型的验证码. 支持自定义验证码字符数量: 支持自定义验证码图片的大小: 支持自定义需排除的特殊字符: * 支持自定义干扰线

  • PHP编写登录验证码功能 附调用方法

    本文实例为大家分享了一个PHP写的登录验证码功能,供大家参考,具体内容如下 ShowKey.php <?php session_start(); //设置COOKIE或Session function esetcookie($name,$str,$life=0){ //本函数将字符串 str 全部变小写字符串使验证码输入不区分大小写----在提交表单进行session比较同样需要次函数转化 $_SESSION[$name]=strtolower($str); } //获取随机字符 此函数区分字符

  • Java中Maven项目导出jar包配置的示例代码

    具体代码如下所示: <!-- 第一种打包方式 (maven-jar-plugin), 将依赖包和配置文件放到jar包外 --> <build> <sourceDirectory>src/main/java</sourceDirectory> <resources> <resource> <directory>src/main/resources</directory> <!-- 将<director

随机推荐