使用 jQuery serialize() 后表单密码字段为纯文本答案

【问题标题】：Form password field is plain text after using jQuery serialize()使用 jQuery serialize() 后表单密码字段为纯文本
【发布时间】：2022-01-22 06:19:12
【问题描述】：

我有一个包含密码字段的登录表单。我以模态方式显示此登录表单，我想处理表单提交响应是一种特殊的方式（实际上将登录栏更新为帐户菜单），所以我阻止了默认表单提交

$("#myformid").submit(function(event){
   var form = $(this);
   console.log(form.serialize());
   event.preventDefault();
   jQuery.ajax({
      url: "http://localhost:5782/login",
      success: function (data) {
        login_form_modal.style.display = 'none';
      },
      data: {
        form: form.serialize(),
      },
      type:"POST",
      async: false,
   });
})

我注意到在浏览器调试控制台中，密码是纯文本。我的问题是，使用 ajax 提交序列化表单是否安全？

'csrf_token=IjI4ODJZjJmMWI5MGU1ZMjM1Y2Y0M2QxNzY3ZGUwZmI5MDki.YcCuVA.3D_79wx6Lp2-hbZWRT04z_eGhbc&username=myusername&password=MyPlainTextPassword'

谢谢，

【问题讨论】：

async: false 在发起网络请求的同时锁定整个 JS 进程，直到响应返回并被处理。有充分的理由不推荐使用它。不要那样做。
能够在开发工具中看到数据是完全正常的，基本上你是在监视自己的输入。浏览器内部没有加密任何内容，其中包括 <form> 和开发工具中的数据。然而，不安全的是您将 http: 用于 AJAX url: 参数。如果通过 https: 发送它将变得安全。
谢谢@PeterB，你说的完全有道理。这只是一个序列化。安全方面的事情需要通过 HTTPS 来处理。

标签： javascript jquery

【解决方案1】：

您必须将密码从客户端发送到服务器。

客户端和服务器都需要知道它是什么——客户端因为它产生它，而服务器因为它必须通过 right 散列算法并将它与其中的任何内容进行比较数据库。

您不希望密码在在传输过程中被截获。这样做的方法是使用 HTTPS 而不是纯 HTTP。（当您使用localhost URL 并且数据是开发数据而不是生产数据时，这显然无关紧要，但需要在您的生产部署中处理）。

【讨论】：