vue 项目实现阻止浏览器记住密码

​在各个浏览器中,登录输入密码一般都会弹出是否记住密码的功能,如果记住之后,会在各个密码框自动填充记住的密码,这无疑是一种不安全的操作,所以要实现禁用阻止浏览器记住密码的行为

查阅资料,也得到很多方法

  • 1、使用 autocomplete="off"
  • 2、使用 autocomplete="new-password"
  • 3、在真正的密码框之前增加相同name的input框
  • 4、使用readonly属性,聚焦时移除该属性
  • 5、将type=password改为text,修改样式改为*或者小黑点

以上的方法我试过1、2,测试发现不能完全实现,浏览器记住密码的弹窗还是会弹出,不排除我哪里没改全,3、4没试,因为感觉改动有点多,最终我采纳了第5种方案,代码如下 

 <el-form-item v-if="showPassword" prop="password"><el-inputref="password"v-model="loginForm.password"type="text"class="no-autofill-pwd"placeholder="密码"><svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" /></el-input></el-form-item>
.no-autofill-pwd {/deep/ .el-input__inner {-webkit-text-security: disc !important;}
}

在谷歌浏览器以及edge浏览器测试,记住密码功能被禁用,密码也不会自动填充 ​

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Y20030028 JAVA+SSM+MYSQL+LW+基于JAVA的考研监督互助系统的设计与实现 源代码 配置 文档

基于JAVA的考研监督互助系统 1.项目描述2. 课题开发背景及意义3.项目功能4.界面展示5.源码获取 1.项目描述 随着高等教育的普及和就业竞争的加剧&#xff0c;越来越多的学生选择继续深造&#xff0c;参加研究生入学考试。考研人数的不断增加&#xff0c;使得考研过程中的学习监…

【AI系统】推理流程全景

推理流程全景 本文介绍神经网络模型在部署态中的两种方式&#xff1a;云侧部署和边缘侧部署。其中&#xff0c;云侧部署适用于云服务器等具备强大计算能力和存储空间的环境&#xff0c;可以实现高吞吐量和集中的数据管理&#xff0c;但可能面临高成本、网络延迟和数据隐私等挑…

9.13[debug]

这个错误表明 Git 尝试通过 HTTPS 协议连接到 Gitee 上的仓库时&#xff0c;实际上却尝试连接到了本地的 127.0.0.1&#xff08;即 localhost&#xff09;的 7890 端口&#xff0c;这通常是因为 HTTP 代理配置错误或全局 Git 配置中的代理设置不正确 如果这些命令返回了代理设…

Linux-GPIO应用编程

本章介绍应用层如何控制 GPIO&#xff0c;譬如控制 GPIO 输出高电平、或输出低电平。 只要是用到GPIO的外设&#xff0c;都有可能用得到这些操作方法。 照理说&#xff0c;GPIO的操作应该是由驱动层去做的&#xff0c;使用寄存器操作或者GPIO子系统之类的框架。 但是&#xff0…

【Linux】用户操作命令

声明&#xff1a;以下内容均学习自《Linux就该这么学》一书 1、管理员root Linux系统的管理员之所以是root&#xff0c;并不是因为它的名字叫root&#xff0c;而是因为该用户的身份号码UID&#xff08;User IDentification&#xff09;的数值是0。UID相当于身份证号码&#x…

Altium Designer学习笔记 28 扇孔处理

基于Altium Designer 23学习版&#xff0c;四层板智能小车PCB 更多AD学习笔记&#xff1a;Altium Designer学习笔记 1-5 工程创建_元件库创建Altium Designer学习笔记 6-10 异性元件库创建_原理图绘制Altium Designer学习笔记 11-15 原理图的封装 编译 检查 _PCB封装库的创建Al…

XiYan-SQL:⼀种多⽣成器集成的Text-to-SQL框架

发布于:2024 年 12 月 03 日 星期二 北京 #NL2SQL #阿里巴巴 #Text-to-SQL 文提出了一种用于自然语言到 SQL 转换的多生成器集成框架 ——XiYan-SQL,旨在应对大型语言模型在 NL2SQL 任务中的挑战。该框架融合提示工程与监督微调(SFT)方法,利用 SFT 的可控性与上下文学习(…

插入算法介绍(c基础)

介绍一下希尔排序法(c基础)-CSDN博客 一、插入算法概述 定义 插入算法是一种常见的排序算法&#xff0c;它的基本思想是通过构建有序序列&#xff0c;对于未排序数据&#xff0c;在已排序序列中从后向前扫描&#xff0c;找到相应位置并插入。适用场景 插入算法适用于数据量较小…

qtcanpool 知 08:Docking

文章目录 前言口味改造后语 前言 很久以前&#xff0c;作者用 Qt 仿照前端 UI 设计了一个 ministack&#xff08;https://gitee.com/icanpool/qtcanpool/blob/release-1.x/src/libs/qcanpool/ministack.h&#xff09; 控件&#xff0c;这个控件可以折叠。部分用户体验后&#…

嵌入式C编程:宏定义与typedef的深入对比与应用

目录 一、宏定义&#xff08;Macro Definition&#xff09; 1.1. 特点与应用 1.1.1 定义常量 1.1.2 定义函数式宏 1.1.3 条件编译 1.2. 作用范围和生命周期方面 1.3. 应用注意事项 二、typedef 2.1. 特点与应用 2.1.1 简化类型声明 2.1.2 提高代码可读性 2.1.3 实现…

如何高效写论文-学习笔记【AI算法研究猿James】

视频链接&#xff1a;如何高效写论文_哔哩哔哩_bilibili 视频里面广告内容较多&#xff0c;为便于复习回顾&#xff0c;现对学习内容进行记录。 目录 1、写论文总体认知 1.1、写论文到底有多重要? 1.2、写论文难在哪儿? 2、从审稿人角度看论文写作 2.1、审稿人在意的是…

使用 EasyExcel 实现高效的 Excel 读写操作

在日常开发中&#xff0c;Excel 文件的读写操作是一个常见的需求。EasyExcel 是阿里巴巴开源的一个高性能、易用的 Excel 读写库&#xff0c;可以大幅提高处理 Excel 文件的效率。它通过事件驱动模型优化了大数据量 Excel 的读写性能&#xff0c;非常适合处理大文件或高并发场景…

电脑插入耳机和音响,只显示一个播放设备

1. 控制面板-硬件和声音-Realtek高清音频-扬声器-设备高级设置-播放设备里选择使用前部和后部输出设备同时播放两种不同的音频流 在声音设置中就可以看到耳机播放选项

代码随想录算法训练营day49|动态规划part11

最长公共子序列 这个与上篇笔记最大的不同就是子序列里的数可以不相邻,那么只需加入一个dp[i][j]的上和左的更新方向即可 class Solution { public:int longestCommonSubsequence(string text1, string text2) {vector<vector<int>> dp(text1.size()1,vector<…

JavaEE-经典多线程样例

文章目录 单例模式设计模式初步引入为何存在单例模式饿汉式单例模式饿汉式缺陷以及是否线程安全懒汉式单例模式基础懒汉式缺陷以及是否线程安全懒汉式单例模式的改进完整代码(变量volatile) 阻塞队列生产者消费者模型生产者消费者模型的案例以及优点请求与响应案例解耦合削峰填…

qt QCryptographicHash详解

1、概述 QCryptographicHash是Qt框架中提供的一个类&#xff0c;用于实现加密散列函数&#xff0c;即哈希函数。哈希函数能够将任意长度的数据转换为固定长度的哈希值&#xff0c;也称为散列值或数据指纹。这个哈希值通常用于数据的完整性校验、密码存储等场景。QCryptographi…

【数据结构】动态规划-基础篇

针对动态规划问题&#xff0c;我总结了以下5步&#xff1a; 确定dp数组以及下标的含义&#xff1b; 递推公式&#xff1b; dp数组如何初始化&#xff1b; 遍历顺序&#xff1b; 打印dp数组&#xff08;用来debug&#xff09;&#xff1b; 以上5步适用于任何动态规划问题&#x…

字符串函数和内存函数

字符串函数 1、strlcpy 【字符串拷贝】 &#xff08;将原字符串中的字符拷贝到目标字符数组中&#xff0c;包括终止符号\0&#xff0c;并在这里停止&#xff1b;为了避免越界&#xff0c;目标字符串数组应该足够大去接收&#xff09;&#x1f446; &#xff08;返回值是 dest…

Electron-vue 框架升级 Babel7 并支持electron-preload webapck 4 打包过程记录

前言 我这边一直用的electron-vue框架是基于electron 21版本的&#xff0c;electron 29版本追加了很多新功能&#xff0c;但是这些新功能对开发者不友好&#xff0c;对electron构建出来的软件&#xff0c;使用者更安全&#xff0c;所以&#xff0c;我暂时不想研究electron 29版…

模型优化与迁移学习

三大要素&#xff1a;数据、算法&#xff08;神经网络&#xff09;、算力 一、数据获取方法 数据集分类 分类数据&#xff1a;用于图像分类&#xff0c;一般是以目录形式分开 标注数据&#xff1a;用于目标检测和图像分割&#xff0c;是有标注数据的 1 开源数据集 1.PyTo…