vue实现手机验证码登录

vue实现手机验证码登录相关知识

• 技术人员必须知道的手机验证码登录风险

  手机验证码登录是一种常见的应用登录方式，简单方便，不用记忆密码，市面上能见到的APP基本都支持这种登录方式，很多应用还把登录和注册集成到了一起，注册+登录一气呵成，给用户省去了很多麻烦，颇有一机在手、天下我有的感觉。 登录原理 手机验证码登录的原理很简单，对于一个正常的登录流程，看下边这张图就够了： 实际应用中会存在一些收不到验证码的情况，可能的原因如下： 在手机端，短信被某些软件认为是垃圾信息而被拦截或者删除，或者因为手机卡欠费导致收不到短信。 在应用服务端
• 如何读取redis的手机号验证码数据，实现自动化登录测试

  1、案例描述 用户选择短信登录 ! 发送短信后，后端接口逻辑已把验证码缓存在redis， ! 在apifox上定义对应下发登录短信接口，短信登录接口 下载地址：www.apifox.cn 这时候问题就来了，怎么样才能让apifox自动获取下发登录短信接口对应的手机号的验证码，自动填充到短信登录接口的code字段？ 2、解决思路 方案一：后端通过接口返回验证码，下发短信接口后再调用该接口去获取验证码（正式环境需要屏蔽该接口，没办法自动化正式环境接口） 方案二：apifox直接访问redis获取数据；这需要
• 微信小程序登录与注册验证码倒计时的效果实现（javascript实现倒计时）

  我们在做手机登录和用户注册时，总会用到倒计时效果，今天就来给大家讲讲手机登录时验证码倒计时效果的实现。 老规矩，先看效果图 可以看到，我们在点击获取验证码以后，就开始倒计时了，正常都是从60s倒计时的，这里为了演示方便，我从6s开始的。可以看到倒计时结束后，按钮又恢复了可以点击的状态。 一，index.wxml布局 布局很简单，就是一个用户获取手机号输入，一个用来获取验证码输入，一个获取验证码按钮，一个登录按钮。 二，index.wxss样式 .item { display: flex; flex-direc
• 十分钟搞懂手机号码一键登录

  手机号码一键登录是最近两三年出现的一种新型应用登录方式，比之前常用的短信验证码登录又方便了不少。登陆时，应用首先向用户展示带有本机号码掩码的授权登录页面，用户点击“同意授权”的按钮之后，应用即可获取到完整的本机号码，从而完成用户的登录认证。在这个过程中，应用只要确认登录用的手机号码是在绑定了此号码的手机上发起的即可认证成功，从这一点来看，它和短信验证码登录并无本质区别，都是一种设备认证登录方式。这篇文章就来捋一下其中的技术门道。 这几年为了保护用户的隐私安

vue实现手机验证码登录相关课程

• 三小时轻松掌握常用验证码制作 验证码是日常开发中最常用的功能之一，也渗透进了生活的方方面面。本课程结合实际需求，总结并介绍现阶段最常用验证码形式及实现思路，方便不同领域学员拿来就用。同时，掌握Java画图、Canvas绘图、jQuery编程和互联网API调用等丰富相关知识，短时间快速获得验证码实现方案大全。

  讲师：十方上下 初级 560人正在学习

• Python前后端分离开发Vue+Django REST framework实战 采用当前流行的前后端分离式开发技术，涉及RESTFul API基础知识和Vue项目结构分析，解决了技术开发单一的痛点，拥有超前的技术融合技能，让你在开发的领域比别人技高一筹！

  讲师：bobby 中级 2607人正在学习

• PHP实现验证码制作 通过分析验证码实现原理，以基础的文字+字母验证码，分析讲解实现方法。并举一反三的讲解如何实现中文、图片、视频验证码。其中会穿插讲解实现过程中可能出现的技术难点、隐患。

  讲师：Pangee 初级 37767人正在学习

vue实现手机验证码登录相关教程

• 5.2 登录表单 class LoginForm(FlaskForm): name = StringField( label = '姓名', validators = [ DataRequired(message = '姓名不能为空') ] ) password = PasswordField( label = '密码', validators =[ DataRequired(message = '密码不能为空'), Length(min = 3, message = '密码至少包括 3 个字符') ] ) submit = SubmitField('登录')使用 WTForms 表单实现登录表单，LoginForm 继承于 FlaskForm，它包含 2 个字段 name 和 password。name 字段的验证器 DataRequired 要求字段不能为空；password 字段的验证器 DataRequired 要求字段不能为空，验证器 Length 要求密码至少包括 3 个字符。
• 1.4 验证码突破 许多做的非常好的网站都会有验证码校验，比如京东、淘宝的登录。更为复杂的还有12306网站那个让人头晕的识图验证等等。目前而言，验证码技术从原来的简单数字、字母识别，到滑块拖动、拼图认证以及最新的图片识别、汉字倒立等，已经越来越复杂和难辨。很多基于机器学习以及深度学习的高难度识别算法应运而生，但这些对于普通程序员而言，难以企及。我们唯有两方面突破：花钱买服务：网上有不少专门的验证码识别服务提供商，比如几年前比较流行的若快平台 (目前官网无法访问，似乎已经凉了)等；开源项目：如果舍不得花钱买服务的，我们只能寄希望于部分开源工具。好在还是有不少大神愿意将他们的研究代码、工具进行开源，这也使得我们能有机会去学习和使用这些工具去突破验证码的限制；京东的拼图验证12306的识图验证
• 4.验证码验证 这里以之前添加学生接口为例，可以添加如下代码:$captcha = $this->request->param('captcha');if(!captcha_check($captcha)){// 验证失败 throw new HttpException(401, "验证码验证失败");}else{ echo "验证成功";}如下图所示：下面演示验证失败的情况：下面演示验证成功的情况：
• 3.3 定义登录表单 class LoginForm(FlaskForm): email = StringField( label = '邮箱', validators = [ DataRequired(message = '邮箱不能为空'), Email(message = '请输入正确的邮箱') ] ) password = PasswordField( label = '密码', validators =[ DataRequired(message = '密码不能为空'), Length(min = 6, message = '密码至少包括 6 个字符') ] ) submit = SubmitField('登录')定义类 LoginForm，它继承于 FlaskForm，用于描述登录界面，登录界面是一个表单，包含有 3 个字段：email，显示 label 为 ‘邮箱’，包括 2 个验证器：DataRequired 和 Email，message 参数为验证失败的提示信息；password，显示 label 为 ‘密码’，包括 2 个验证器：DataRequired 和 Length，message 参数为验证失败的提示信息，min = 6 表示密码的最小长度；submit，提交按钮，提交表单给服务端。
• 3.1 创建登录页面 <h1>用户登录</h1><form action="user/login" method="post"> 姓名：<input name="userLoginName" value="" type="text"> <br /> 密码：<input name="userPassword" value="" type="password"> <br /> <input name="btnLogin" value="登录" type="submit"> <input name="btnRe" value="重置" type="reset"></form>Tips： 当使用者点击登录按钮，发送登录请求之前，可以在客户端使用 JS 验证数据格式的合法性。既然是 OOP 编码，自然少不了构建用户类，此类的数据结构与用户表的表结构有对等关系。public class User { private Integer userId; //登录名 private String userLoginName; //真实姓名 private String userName; private String userPassword;}
• 1. 基于 Cookie 的自动登录 如果是想基于基本的 API 方式登录，我们会面临两大难点：手机验证码校验 ，如下图所示：起点网站登录手机发送验证码滑动验证码校验，如下图所示：起点网站登录滑动验证码绕过这些校验的方法超过了本教程的知识范围，故我们不再次详细讨论。好在起点网支持自动登录过程，也就是 Cookie 登录：起点网支持自动登录第一次手动登录起点，选择自动登录后，起点网站返回的 Cookie 信息就会保存至本地。下次再访问起点网时，通过请求带上该 Cookie 信息就能正确识别用户，实现自动登录过程。Cookie 存在本地，就存在被代码读取的可能。通常而言，我们来使用 Python 中的 browsercookie 库可以获取浏览器的 cookie，目前它只支持 Chrome 和 FireFox 两种浏览器。不过对于 Chrome 80.X 版本的浏览器，其中的 cookie 信息被加密了，我们无法按照早期的操作进行 cookie 读取。不过网上这个博客给出了一个解密 Cookie 的代码，我们拿过来简单改造下，做成一个辅助模块：# 参考文档：https://blog.csdn.net/u012552769/article/details/105001108import sqlite3import urllib3import osimport jsonimport sysimport base64from cryptography.hazmat.backends import default_backendfrom cryptography.hazmat.primitives.ciphers import Cipher, algorithms, modesurllib3.disable_warnings(urllib3.exceptions.InsecureRequestWarning)def dpapi_decrypt(encrypted): import ctypes import ctypes.wintypes class DATA_BLOB(ctypes.Structure): _fields_ = [('cbData', ctypes.wintypes.DWORD), ('pbData', ctypes.POINTER(ctypes.c_char))] p = ctypes.create_string_buffer(encrypted, len(encrypted)) blobin = DATA_BLOB(ctypes.sizeof(p), p) blobout = DATA_BLOB() retval = ctypes.windll.crypt32.CryptUnprotectData( ctypes.byref(blobin), None, None, None, None, 0, ctypes.byref(blobout)) if not retval: raise ctypes.WinError() result = ctypes.string_at(blobout.pbData, blobout.cbData) ctypes.windll.kernel32.LocalFree(blobout.pbData) return resultdef aes_decrypt(encrypted_txt): with open(os.path.join(os.environ['LOCALAPPDATA'], r"Google\Chrome\User Data\Local State"), encoding='utf-8', mode="r") as f: jsn = json.loads(str(f.readline())) encoded_key = jsn["os_crypt"]["encrypted_key"] encrypted_key = base64.b64decode(encoded_key.encode()) encrypted_key = encrypted_key[5:] key = dpapi_decrypt(encrypted_key) nonce = encrypted_txt[3:15] cipher = Cipher(algorithms.AES(key), None, backend=default_backend()) cipher.mode = modes.GCM(nonce) decryptor = cipher.decryptor() return decryptor.update(encrypted_txt[15:])def chrome_decrypt(encrypted_txt): if sys.platform == 'win32': try: if encrypted_txt[:4] == b'x01x00x00x00': decrypted_txt = dpapi_decrypt(encrypted_txt) return decrypted_txt.decode() elif encrypted_txt[:3] == b'v10': decrypted_txt = aes_decrypt(encrypted_txt) return decrypted_txt[:-16].decode() except WindowsError: return None else: raise WindowsErrordef get_cookies_from_chrome(domain, key_list): sql = f'SELECT name, encrypted_value as value FROM cookies where host_key like "%{domain}%"' filename = os.path.join(os.environ['USERPROFILE'], r'AppData\Local\Google\Chrome\User Data\default\Cookies') con = sqlite3.connect(filename) con.row_factory = sqlite3.Row cur = con.cursor() cur.execute(sql) cookie_dict = {} for row in cur: if row['value'] is not None: name = row['name'] value = chrome_decrypt(row['value']) if value is not None and name in key_list: cookie_dict[name] = value return cookie_dictTips：上述这段代码不用纠结细节，前面函数的主要是替 get_cookies_from_chrome() 函数服务的，而该函数的输入要搜索的网站以及提取相应网站 cookie 信息中的某个具体字段，返回相应的结果。本人 Python 3.8.2 安装的是 win32 版本，该段代码亲测有效。来看看起点中文网给读者生成的 cookie 数据，我们调用上面的获取 cookie 信息的代码来从中提取相应数据：起点的cookie信息print(get_cookies_from_chrome('qidian.com', '_csrfToken'))print(get_cookies_from_chrome('qidian.com', 'e1'))print(get_cookies_from_chrome('qidian.com', 'e2'))执行上述代码我们可以得到如下结果：PS C:\Users\spyinx> & "D:/Program Files (x86)/python3/python.exe" c:/Users/spyinx/Desktop/test_cookie.py{'_csrfToken': 'YJklLmhMNpEfuSmqZZGaK72D4sUVJty52gyKwXXX'}{'e1': '%7B%22pid%22%3A%22qd_p_qidian%22%2C%22eid%22%3A%22qd_A08%22%2C%22l1%22%3A1%7D'}{'e2': '%7B%22pid%22%3A%22qd_p_qidian%22%2C%22eid%22%3A%22qd_A10%22%2C%22l1%22%3A1%7D'}这说明我们通过前面的代码能争取获取到起点网保存在 Chrome 浏览器中的 cookie 信息。因此，前面的代码将作为我们读取起点用户登录 Cookie 的重要辅助模块。Tips：这个测试只能在装了 Chrome 浏览器的 Windows 系统上进行测试，或者是 Linux 的桌面版我们首先来创建一个起点爬虫：PS C:\Users\Administrator\Desktop> scrapy startproject qidian_spider接下里我们来看看要提取的我的书架的信息：我的书架书籍信息对应的 items.py 的内容如下：# https://docs.scrapy.org/en/latest/topics/items.htmlimport scrapyclass QidianSpiderItem(scrapy.Item): # define the fields for your item here like: # name = scrapy.Field() # 分组 category = scrapy.Field() # 小说名 name = scrapy.Field() # 最新章节 latest_chapter = scrapy.Field() # 作者 author = scrapy.Field() # 更新时间 update_time = scrapy.Field() # 阅读进度 progress_status = scrapy.Field()接下来，在爬虫部分需要请求该页面然后提取相应的数据，我们的爬虫代码如下："""获取用户书架数据"""import jsonfrom urllib import parsefrom scrapy import Requestfrom scrapy.spiders import Spiderfrom .get_cookie import get_cookies_from_chromefrom ..items import QidianSpiderItemclass BookCaseSpider(Spider): name = "bookcase" # 构造函数 def __init__(self): # 最重要的就是这个获取起点的cookie数据了，这里保存了之前用户登录的cookie信息 self.cookie_dict = get_cookies_from_chrome( "qidian.com", ["_csrfToken", "e1", "e2", "newstatisticUUID", "ywguid", "ywkey"] ) def start_requests(self): url = "https://my.qidian.com/bookcase" # http请求时附加上cookie信息 yield Request(url=url, cookies=self.cookie_dict) def parse(self, response): item = QidianSpiderItem() books = response.xpath('//table[@id="shelfTable"]/tbody/tr') for book in books: category = book.xpath('td[@class="col2"]/span/b[1]/a[1]/text()').extract_first() name = book.xpath('td[@class="col2"]/span/b[1]/a[2]/text()').extract_first() latest_chapter = book.xpath('td[@class="col2"]/span/a/text()').extract_first() update_time = book.xpath('td[3]/text()').extract_first() author = book.xpath('td[@class="col4"]/a/text()').extract_first() progress_status = book.xpath('td[@class="col5"]/a/text()').extract_first() item['category'] = category item['name'] = name item['latest_chapter'] = latest_chapter item['update_time'] = update_time item['author'] = author item['progress_status'] = progress_status print(f'get item = {item}') yield item最重要的方法就是那个获取 cookie 信息的方法了，正是靠着这个 cookie，我们才能获取相应的用户书架的网页并提取相应的书籍信息。接下来，简单实现一个 item pipeline 用于保存书架上的书籍信息，该代码位于 scrapy/pipelines.py 文件中，默认的 pipelines 都写会在这里：# 源码位置：scrapy/pipelines.py# Define your item pipelines here## Don't forget to add your pipeline to the ITEM_PIPELINES setting# See: https://docs.scrapy.org/en/latest/topics/item-pipeline.htmlimport json# useful for handling different item types with a single interfacefrom itemadapter import ItemAdapterclass QidianSpiderPipeline: def open_spider(self, spider): self.file = open("bookcase.json", 'w+', encoding='utf-8') def close_spider(self, spider): self.file.close() def process_item(self, item, spider): data = json.dumps(dict(item), ensure_ascii=False) self.file.write(f"{data}\n") return item最后别忘了在 settings.py 中添加这个 item pipeline：ITEM_PIPELINES = { 'qidian_spider.pipelines.QidianSpiderPipeline': 300,}我们运行下这个爬虫，看看是否能抓到我们想要的数据：PS C:\Users\Administrator\Desktop> scrapy crawl bookcase最后的结果如下：获取用户的书架上书籍信息这样，我们就成功实现了用户登录后的访问动作。接下来我们在这个基础上进一步扩展，实现清除书架上所有的书籍，类似于淘宝的一键清除购物车。

vue实现手机验证码登录相关搜索

vacuum vagrant val validationgroup validationsummary vals valueof values vant variables vb vb if else vb if语句 vb net vb net 教程 vb net 数据库 vb net教程 vb net下载 vb 教程 vb 数组

查看更多慕课网实用课程