开发环境准备 本地环境配置需要：Node.js，IDE，Vue-CLi，Linux 虚拟机自建环境，购买服务，安装Docker具体介绍：Node.js(npm/yarn) + nvm(node.js版本管理)IDE(Webstorm/Vscode/Atom) Node.js Node.js官网地址：https://nodejs.org/zh-cn/我们浏览器打开后会显示如
今天在项目中需要使用一个验证码输入框，上图： 由于压缩了，GIF不太清晰，补个原图：刚开始想的是使用四个input，输入时聚焦到下一个，删除则聚焦到上一个，仔细一想太麻烦，放弃了。之后想就使用一个input，把letter-spacing调大，再去控制四个div的CSS，不优雅，而且下次复用直接完蛋，也放弃了。这个输入框最大的难点就在于光标位置切换，一直转进input聚焦的死胡同里了，后
转载
2024-06-21 12:37:10
452阅读
最近整理一个爬虫系列方面的文章，不管大家的基础如何，我从头开始整一个爬虫系列方面的文章，让大家循序渐进的学习爬虫，小白也没有学习障碍.爬虫篇 | Python使用正则来爬取豆瓣图书数据爬虫篇 | 学习Selenium并使用Selenium模拟登录知乎爬虫篇 | 不会这几个库，都不敢说我会Python爬虫爬虫篇 | Python现学现用xpath爬取豆瓣音乐爬虫篇 | Python最重要与
转载
2024-03-20 15:13:41
0阅读
Spring Boot 整合 Spring Security ，配置验证码。1 创建工程创建 Spring Boot 项目 spring-boot-springsecurity-verifycode ，添加 Web/Spring Security 依赖，如下：最终的依赖如下：<dependencies>
<dependency>
<groupI
转载
2024-03-26 11:55:58
148阅读
<canvas id="canvas" :width="canvas_clientWidth" :height="canvas_clientHeight" @click="refresh" ref="canvas" >
转载
2021-04-29 08:51:52
371阅读
2评论
// 第一种方法，span，不绘制干扰点<template> <div class="ValidCode disabled-select" :style="`width:${width}; height:${height}`" @click="refreshCode"> <span v-for="( ...
转载
2021-07-29 10:19:00
597阅读
2评论
目录一， vue-puzzle-vcode插件1、安装vue-puzzle-vcode2，实现代码 3，效果图二， vue2-verify三，vue-monoplasty-slide-verify 1，安装2，实现3，效果图四、封装组件五、基于svg-captcha（推荐）六、原生js0，vue-monoplasty-slide-verify/ v
转载
2024-03-01 18:20:19
1170阅读
作者 | 崔庆才
原文：200行代码实现一个滑动验证码
做网络爬虫的同学肯定见过各种各样的验证码，比较高级的有滑动、点选等样式，看起来好像挺复杂的，但实际上它们的核心原理还是还是很清晰的，本文章大致说明下这些验证码的原理以及带大家实现一个滑动验证码。
我之前做过 Web 相关开发，尝试对接过 Lavavel 的极验验证，当时还开发了一个 Lavavel 包：
转载
2024-08-22 17:50:56
521阅读
一、需求 1，场景 我们在很多登录和注册场景里，为了避免某些恶意攻击程序，我们会添加一些验证码，也就是行为验证，让我们相信现在是一个人在交互，而不是一段爬虫程序。现在市面上用的比较多的，比较流行的是极验的滑动验证码。 2，伪代码1，当打开登录页面时，页面还没加载完毕，浏览器就自动往服务器发送一个get请求，主要是请求极验滑动验证码的相关数据，页面接收到相关数据后，在页面渲染出一个滑动验证
转载
2024-03-04 14:26:10
321阅读
1 短信验证码接口1 前端发送get请求，携带手机号，调用封装好的发送短信接口，完成发送短信，给用户返回提示信息
2 路由：send_code 视图函数：SendCodeView
3 如果有人恶意使用你的接口如何解决？
-1 限制频率：手机号一分钟一次
-2 限制ip：一分钟一次
-3 发送验证码之前，先输入验证码（集成了极验滑动验证码）1.1 路由router.reg
转载
2023-09-07 01:45:59
67阅读
图片验证码主要用于注册，登录等提交场景中，目的是防止脚本进行批量注册、登录、灌水，相比不带图片验证的安全度有所提高，不过目前也有自动识别图片验证码的程序出现，基本都是付费识别，随之又出现了滑动验证，选取正确选项验证等更加安全的验证方式。但图片验证码码仍用于大部分网站中。一、前端图片验证码生成前端逻辑大体就是进行图形绘制，取几个随机数放入图片中，加入干扰，进行验证1.创建验证码组件identify.
转载
2024-06-24 05:35:10
77阅读
在springboot整合spring-security实现简单的登录注销 的基础上进行开发。1、添加生成验证码的控制器。（1）、生成验证码1 /**
2 * 引入 Security 配置属性类
3 */
4 @Autowired
5 private SecurityProperties securityProperties;
6
转载
2023-06-28 15:19:14
158阅读
一，图形验证码的用途?1，什么是图形验证码？验证码（CAPTCHA）是“Completely Automated Public Turing test to tell Computers and Humans Apart”（全自动区分计算机和人类的图灵测试）的缩写，它是用来区分用户是人类还是计算机的公共全自动程序它可以防止对url的恶意刷量/频繁攻击/破解密码等 2，如果有短信验证码，还
转载
2023-09-11 23:11:39
10阅读
第一步：npm install --save vue-monoplasty-slide-verify第二步：main.js配置import Vue from 'vue';import SlideVerify from 'vue-monoplasty-slide-verify';Vue.use(SlideVerify);第三步：vue页面或组件：// template&...
原创
2022-01-16 10:23:30
1672阅读
// 获取验证码let endMsRes = new Date().getTime() + 45000;localStorage.setItem("myEndTime", JSON.stringify(endMsRes));this.codeCountDown(endMsRes);// 存储验证码时隔 codeCountDown(endMsRes) { this.BtnStatus = false; this.countDownTime = Math.ceil((e
原创
2022-02-05 15:35:14
285阅读
// 获取验证码let endMsRes = new Date().getTime() + 45000;localStorage.setItem("myEndTime", JSON.stringify(endMsRes));this.codeCountDown(endMsRes);// 存储验证码时隔 codeCountDown(endMsRes) { this.BtnStatus = false; this.countDownTime = Math.ceil((e
原创
2021-08-26 11:45:57
226阅读
1、目标效果 2、代码 结构 1 <template> 2 <div class="vertify-box"> 3 <div class="vertify"> 4 <img 5 src="@/assets/logo.png" 6 alt="" 7 > 8 <input 9 v-model="vert ...
转载
2021-09-26 16:31:00
286阅读
2评论
# Java + Vue 图形验证码实现指南
在web应用中，图形验证码常用于用户注册和登录等场景，以防止恶意攻击。实现一个图形验证码的流程可以总结为以下几个步骤：
## 流程概述
| 步骤编号 | 步骤名称 | 描述 |
|----------|----------------|------------------
