在 React.js 中以组件状态存储表单输入,特别是密码

2024-03-22

有一个关于 React.js 中表单的问题。我实际上没有问题,但想知道我的方法是否有任何缺陷。

我有一个简单的表单,有两个电子邮件和密码输入,如下所示:

  <input
   type="email"
   name="email"
   value={this.state.email}
   onChange={this.handleChange}
   data-message-required="Please enter your email address"
   data-message-email="Please enter a VALID email address"
   />

and

<input
 type="password"
 name="password"
 value={this.state.password}
 onChange={this.handleChange}
 data-minlength="3"
 data-maxnlength="20"
 data-message="Please enter your password"
 />

handleChange() 的写法如下:

  handleChange = e => {
   this.setState({
    [e.target.name]:e.target.value
  })}

我的问题是,这段代码是否存在漏洞?使用 React Dev Tools 时,我可以跟踪组件的内部状态,并且密码显示为明文。我不确定这是否意味着其他来源可以通过跟踪组件的状态来获取密码。

抱歉,如果这个问题之前已经得到解答,我进行了快速搜索,但找不到专门针对该主题的内容。谢谢你的时间。


不,这里没有漏洞:用户输入密码后,将能够在浏览器中看到密码......

密码不应该成为其所有者的秘密......:-)

当然你会使用https如果您将密码发送到服务器,则使用协议,否则它将可见在电缆上, 一个那个is安全问题!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 React.js 中以组件状态存储表单输入,特别是密码 的相关文章

  • 由于 MIME 类型而导致资源被阻止?

    多年来我已经成功地包含动态创建的 javascript 文件 这是一个例子 https granadainfo com sups php locs 95 https granadainfo com sups php locs 95 正如你所
  • 为动态加载的 HTML 内容触发 Bootstrap JS 行为

    我正在动态加载包含 Bootstrap 标记的 HTML 模板 但是 Bootstrap Javascript 行为不会应用于加载的内容 例如 如果加载的内容包含 Bootstrap 模式的标记 则该模式将无法正确运行 有没有办法可以触发
  • 如何用 JavaScript 修复图像透视变形和旋转?

    我有一些用手机拍摄的图像 有没有可以拉直纸张照片并将其压平的 JavaScript 库 例如 我想创建一个矩形图像 该图像没有任何失真 换句话说我想知道如何用 JavaScript 修复透视变形和旋转 例如 我发现下面的示例图像来自this
  • Angular UI-Router:多个 URL 到单一状态

    我已经开始使用 Angular 的 ui router 并且我正在尝试弄清楚如何让多个 URL 引用单个状态 例如 orgs 12354 overview retyrns the same pages as org overview 我的
  • SVG线宽问题

    我开始了我的svg学习 我想用svg线做一些技巧吧 但有件事我不明白 我为每个技能创建 2 行 一行是空的 另一行是知识百分比 问题是 前两行的高度是我给出的笔画宽度的一半 其他线都有很好的高度 这是一个 jsbin http jsbin
  • jquery 中可点击 div 中的按钮

    我有整个 div 您可以单击它来切换该 div 的主要部分 问题是我在该 div 中也有可点击的按钮 当我点击它时 它会执行它应该做的事情 但同时也会切换整个 div 我怎样才能禁用它 Use event stopPropagation 单
  • Angular 2 将字符串转换为 md5 哈希

    我找到了ts md5 https www npmjs com package ts md5包 但在示例中它有一个hashStr方法 但现在不行了 类型上不存在属性 hashStr Md5 使用该错误后 该错误会记录在我的控制台中 我怎样才能
  • 如何在打字稿中使用外部js

    我通过 Typescript 代码生成 Angular JS 代码 在一种情况下 我需要将外部 JS 文件添加到我的打字稿文件中 并且需要访问 js 文件中的类 我像这样添加js文件
  • Javascript location.href 到 mailto 触发 GET HTTP,该 HTTP 在 Chrome 中被取消

    我有一个按钮可以触发以下 javascript 函数 function sendEmail var mail mailto email protected cdn cgi l email protection location href m
  • ES6 静态方法引用 self? [复制]

    这个问题在这里已经有答案了 我有两节课 存储库和用户存储库 我想在 Repository 中定义一个静态方法 该方法在运行时调用 UserRepository 中的静态函数 有什么干净的方法可以做到这一点吗 class Repository
  • 检查浏览器空闲的替代方法

    我有一个简单的网络信息亭 在鼠标未使用 jQuery 移动 30 秒后显示用户操作提示 var i null body wrap mousemove function clearTimeout i overlay fadeOut i set
  • 为什么我的 D3 SVG 图上的轴不会更新?

    I have 简单的 D3 散点图 http www raxacoricofallapatorius com test scattertest html我在显示数据的几个不同属性之间切换 但是虽然我可以更改数据点 并按照我想要的方式进行转换
  • Javascript等待/异步执行顺序

    所以我试图把我的头脑集中在 Promise await async 上 我不明白为什么当 go 执行时 带有 finished 的警报会紧随 console log coffee 之后 当所有函数都使用等待 承诺时 为什么它只等待 getC
  • 如何使用 jQuery 过滤 DropDownList 中的选项

    我有 2 个 DropDownList 第一个 DropDownList 有 4 个选项 第二个 DropDownList 有 20 个选项 我想要一个选项value 1在第一个 DropDownList 中选择我在第二个 DropDown
  • ‘state’未定义 no-undef

    我使用教程来学习 React 但我很快就陷入困境 在教程中 他们使用以下代码 import React Component from react class Counter extends Component state count 0 r
  • highchart堆积柱每个类别的总数据

    我想获取每个类别的总数据 这point stackTotal只给出活动数据的总数 从我粘贴的代码示例中 我想知道每种水果的总消耗量 因此 即使我单击右上角图例上的乔的名字 这使得堆叠图表上的所有乔信息都处于非活动状态 我仍然可以知道约翰 简
  • Array.of 与“[ ]”。何时使用 Array.of 而不是“[ ]”?

    当我发现时我正在读一些书Array of https developer mozilla org en docs Web JavaScript Reference Global Objects Array of 根据 MDN Array o
  • javascript:完全删除top.location.hash?

    如果我的地址栏中已经有一个哈希值 例如domain com whatever 我打电话 top location hash wathever 被转换为domain com 没有任何内容 是否可以完全删除哈希值 所以没有 left 因为如果我
  • 如何从 Cloud Functions for Firebase 文件夹读取证书文件

    我正在尝试读取 certs 文件夹下的文件 如下所示 functions certs idp public cert perm 这是我用来读取文件的代码 fs readFileSync path join dirname certs idp
  • 使用
    元素作为 JavaScript 代码的输入。这是最好的方法吗?

    各位 显然 我是编码新手 所以最近完成了一些有关 HTML 和 Javascript 的 Lynda 课程后 我的简单 HTML 页面遇到了困难 基本上 我想要的是使用 JavaScript 进行基本计算 让用户使用 HTML 输入两个数字

随机推荐

  • Android 模拟器 - Wifi 错误

    我正在使用 Android SDK 模拟器广告尝试连接到网络 我无法在设置 gt 无线和网络中执行此操作 在我需要打开 WiFi 的地方 我收到 错误 怎么解决呢 Gorov 关闭模拟器 关闭以太网 火线和任何其他网络接口 他们全部 我的意
  • 在同一程序中调用 srand() 两次[关闭]

    Closed 这个问题不符合堆栈溢出指南 help closed questions 目前不接受答案 为什么当我在两个截然不同的点调用 srand 时会导致数字不是随机的 一旦我删除其中一个 它就会恢复正常 这取决于你如何称呼它 的目的sr
  • 在 JavaScript 中,如果我分配给一个具有 getter 但没有 setter 的对象属性,会发生什么情况?

    在下面的代码中 都使用了console log o x print 1 任务会发生什么情况o x 2 就这样被忽略了吗 var o get x return 1 console log o x 1 o x 2 console log o x
  • Java:在后台更新有大量行的 JTable

    我正在编写一个简单的 Java Swing 实用程序 它将从 MQ JMS 服务器读取消息并将它们显示在 JTable 中 private void getMessages try if null Queue Queue close Clo
  • 如何隐藏 emacs 创建的备份文件?

    我在使用 vi 很长时间后才开始使用 emacs 让我烦恼的一件事是 每当我修改文件 保存它并退出 emacs 时 我都会看到在同一目录中创建一个名为filename 如果我编辑的文件是filename 有什么办法可以摆脱这个吗 或者隐藏这
  • 将预测与 svyglm 结合使用

    我发现了一些奇怪的行为predict和svyglm对象从survey包裹 如果你的新数据在predict具有一个级别的因子 字符会输出错误 Error in contrasts lt tmp value contr funs 1 isOF
  • 如何使用 Ruby MiniTest::Spec 和 Rails 进行 API 集成测试?

    我正在构建一个包含 Rails API 的应用程序 并希望使用 Ruby MiniTest Spec 进行测试 有什么好的设置方法吗 例如 良好的目录组织 包含文件的良好方式等 我正在使用 Rails 3 In Action 一书中的指南
  • 在 Windows 上使用 Emacs 编译 C++ 程序

    我已经使用 Emacs 进行基本文本编辑有一段时间了 但从今天开始 我尝试使用它进行 C 编译 在过去的几个小时里 我一直在寻找如何解决这个问题 但我在他们的技术中不断遇到障碍 我认为其中一些与教程过时有关 基本上 我想做的就是能够通过 M
  • FCM/GCM JSON 有效负载 - 如何指定大图标?

    我正在使用 firebase 端点发送推送通知 它正在成功运行 我正在使用邮递员将请求发送到 FCM 我的问题是我不明白如何发送大图标 FCM 有两种可以发送的有效负载 数据有效负载和通知有效负载 See here https fireba
  • Web 控制浏览器后退按钮

    我正在使用导航 2 和setUrlStrategy PathUrlStrategy 我添加了WillPopScope但是onWillPop单击浏览器的后退按钮时不会调用 Widget build context return WillPop
  • 了解 LISP 中的绑定变量和自由变量

    我正在阅读SICP 又出现了绑定变量和自由变量的话题 然而 我对此感到困惑 术语 绑定变量 仅适用于形式参数变量吗 此外 文本还指出过程定义 绑定 其形式参数 这让我感到困惑 因为有些人说我们将值 绑定 到变量 显然 当我们谈论不同类型的变
  • Gulp 复制空目录

    In my gulp构建我已经创建了一个运行的任务after所有的编译 丑化和缩小都已经发生 此任务只是复制所有内容src进入dest早期任务尚未触及 处理的目录 我遇到的一个小问题是 这会导致目录中出现空目录dest目录 有没有办法告诉g
  • [UWP]调整BitmapImage的大小、压缩并获取base64字符串

    这是我的第一个主题 我正在 UWP 中重写在 Silverlight 8 WP8 中开发的应用程序 我在从 BitmapImage 获取 Base64 编码字符串时遇到问题 我工作了很多天都找不到解决方案 总之我需要 从设备图库中选择图像
  • H2 控制台和 Spring Security - PermitAll() 不起作用

    我正在创建rest api并实现Spring Security 一切正常 但我希望 目前 当我仍在开发时 能够让任何未经授权的人打开localhost 8080 console 我的代码 Override protected void co
  • docker-desktop 使用 12 GB RAM 来运行一个具有 24 MB RAM 的容器?

    在我看来就像 WSL2 容器docker desktop使用 12 GB RAM 来运行一个具有 24 MB RAM 的容器 是什么赋予了 详情如下 另外 当我将所有进程中的所有驻留 RAM VSZ 加起来时docker desktop 总
  • 使用 Node.js 在 Mongodb 中存储 JS 函数时出现问题

    我有一个简单的 JS 类 var User function id this id id this sayHello function return hello 然后 我使用默认的 Node js 驱动程序将其存储在 MongoDB 中 u
  • 在 Razor 中显示表达式值

    我想在剃刀视图中将以下表达式的值显示为文本 doc Extension string Empty ToUpperInvariant 我已经尝试了所有变体 但似乎没有任何效果 我知道我可以使用临时变量来存储该表达式的值 但我想知道是否有一种方
  • 如何解码/重新创建 Google Flights 搜索网址?

    问题 On 谷歌航班 http www google com travel flights 搜索信息被编码在 URL 参数中 这样用户就可以轻松地彼此共享航班搜索 URL 格式如下所示 https www google com travel
  • Spring Boot - RestController 反序列化 YAML 上传?

    如何配置 Spring Boot RestController 来接受 YAML 上传 下面的结果是 415 我从调试中可以看到MappingJackson2HttpMessageConverter我的 Spring 上下文中的实例仅支持
  • 在 React.js 中以组件状态存储表单输入,特别是密码

    有一个关于 React js 中表单的问题 我实际上没有问题 但想知道我的方法是否有任何缺陷 我有一个简单的表单 有两个电子邮件和密码输入 如下所示