如何设置正确的用户名和密码文本框？

Question

我的登录界面有用户名和密码，但它还有一个类似于域名的公司字段。

问题是浏览器将域名框用作用户名，因此当你保存密码时，如果你在域名框中输入了域名，它就会将密码填入密码框中，然后你只需要添加用户名，这很可能是该计算机用户。这显然是一个严重的安全问题。

例如：用户：Tom，公司：Netweb，密码：test

Tom 登录一次并点击保存密码。下次他回来时，他输入 Netweb 到域名框中并按回车键，它会填写为该域名保存的密码，然后他就可以输入用户名了。

我该怎么办？是否有一种方法可以设置用户名，使其不使用公司名称，或者一种在添加密码之前先使用前两个字段的方法？

我的代码如下：

<tr class="center">
    <td class="center">User Name
        <br />
        <asp:TextBox ID="txtUser" runat="server"></asp:TextBox>
    </td>
</tr>
<tr class="center">
    <td class="center">Company
        <br />
        <asp:TextBox ID="txtCompany" runat="server"></asp:TextBox>
    </td>
</tr>
<tr class="center">
    <td class="center">Password
        <br />
        <asp:TextBox ID="txtPass" runat="server" TextMode="Password"></asp:TextBox>
        <br />Remember me?
        <asp:CheckBox ID="chkPersistCookie" runat="server" AutoPostBack="false" />
        <br />
        <br />
        <asp:Button ID="btnSubmit" runat="server" Text="Login" CssClass="center" OnClick="btnSubmit_Click" />
        <br />
        <asp:Label ID="lblMessage" runat="server"></asp:Label>
        <br />
        <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtUser" ErrorMessage="Please enter a user name" ForeColor="Red"></asp:RequiredFieldValidator>
        <br />
        <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="txtCompany" ErrorMessage="Please enter a company" ForeColor="Red"></asp:RequiredFieldValidator>
        <br />
        <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="txtPass" ErrorMessage="Please enter a password" ForeColor="Red"></asp:RequiredFieldValidator>
    </td>
</tr>

- connersz

---

你尝试过禁用该文本框，直到用户名称和公司都有值吗？作为替代方案，您可以处理密码文本框中的更改并拒绝它们（在按键时防止默认操作），直到其他字段填充。 - Adriano Repetti

不，使用JavaScript在客户端完成。 - Adriano Repetti

但是大概浏览器正在使用JS将密码添加到框中，我该如何阻止它？ - connersz

不，浏览器并没有使用JS来实现这个。如果您禁用并将输入设置为只读，则浏览器将不会填充它。只需为用户名和密码输入框添加客户端事件处理程序即可，包括按键事件。 - Adriano Repetti

仍然无法验证用户，所以我可以向用户添加空格或随机字符，输入公司名称，然后获取密码。 - connersz

Answer 1

您面临的问题是表单值的“自动完成”属性。当您提交表单时，浏览器会保存表单值以供在同一页面上进一步使用。有时，浏览器还会提供用户保存该网站密码的功能。

就像这样：

<input type="text" name="someInputName" autocomplete="off|on" />

请注意，即使浏览器为自动完成功能保存数据，它也绝对不会保存用户密码。除非用户允许软件这样做，否则密码不会保存在任何地方。

此处您面临的是浏览器的表单自动完成功能。在这种情况下，浏览器保存用户的数据，然后您可以通过进入浏览器设置并进一步操作来删除浏览器中的该数据，选择已保存的密码，然后删除您站点的密码。

否则，您无法控制用户想要做什么。但是，像谷歌一样，您可以实现他们的安全理念。

他们的做法是向您展示一个密码类型的输入框，然后写出与该帐户相关联的电子邮件地址。这样，您就可以欺骗浏览器，让浏览器认为您需要其他东西而不是密码。

还有其他一些事情可以做。例如，在一页上获取用户的电子邮件地址，然后在下一页上获取密码，就像谷歌现在所做的那样。

- Afzaal Ahmad Zeeshan

---

显然，由于非法的资金转移，Payza网站已经关闭。 - abdul qayyum

Answer 2

如果问题仅限于文本框中自动提示密码，那么您需要禁用文本框的AutoComplete属性。

- adi

Answer 3

对于自动完成字段，最好尽可能向浏览器提供有用的指针。在您的情况下，可以这样做：

<asp:TextBox ID="username" x-autocompletetype="given-name" runat="server"></asp:TextBox>
<asp:TextBox ID="txtCompany" x-autocompletetype="organization" runat="server"></asp:TextBox>
<asp:TextBox ID="password" x-autocompletetype="password" runat="server" TextMode="Password"></asp:TextBox>

请注意，这是针对表单本身而不是您所引用的登录类型的。此外，这些内容是使用HTML表单输入进行测试的-我假设ASP应将自定义属性转换为生成的HTML代码，但这是可能失败的。但可以确定ASP的ID映射到HTML输入名称。

---

这对我来说是一个非常有趣的问题，因为自动完成似乎还远未成为标准之一。 HTML5 W3规范

"on"关键字表示用户代理可以为用户提供自动完成值，但不提供任何进一步的信息，以了解用户可能需要输入什么类型的数据。用户代理必须使用启发式方法来决定建议哪些自动完成值。

谷歌团队似乎希望通过他们的提案改变这种情况。

当前的自动填充产品依赖于上下文线索来确定应该填入表单元素的数据类型。这些上下文线索的示例包括输入元素的名称、周围的文本和占位符文本。

我们已经与多个自动填充产品的开发者讨论了这些临时方法的缺点，所有人都对一种让网站作者自己分类其表单字段的解决方案感兴趣。虽然目前的字段分类方法总体上运作良好，但对于许多情况，由于 Web 开发人员在创建表单时使用的许多变化和约定而不可靠或模糊：

这里有一个很好的链接，介绍了如果实施该提案将如何运作：

<input type="text" name="firstname" value="" x-autocompletetype="given-name">  
<input type="text" name="doesn-matter" value="" x-autocompletetype="family-name">  
<input id="email" type="text" name="email" value="" x-autocompletetype="email">

更多链接：

• WHATWG关于自动完成类型的维基页面
• Google博客文章介绍x-autocompletetype

- Sharadh

---

我尝试添加自动完成类型，就像您的第一个示例一样，因为它们是asp控件，但仍然没有变化。我还添加了一张图片来展示这个问题。 - connersz

我无法在Chrome中使其正常工作，是否有实时示例或演示页面？ - Nicolas Thery

Answer 4

现在的解决方法是最后交换文本框。

- connersz

---

你说的“在最后交换文本框”是什么意思？能否通过展示你的代码来解释一下？ - Darshan Faldu

Answer 5

我们处理这个问题的方法是在每次页面加载时向文本框的id和name属性附加一个随机值。这样，浏览器就无法调用自动完成，因为它是针对具有不同标识符的字段存储的。

使用ClientIDMode =“Static”，这样.NET就不会为您生成ID。

- Evert

Answer 6

浏览器自动填充凭据到错误的文本字段？

有时我在Chrome和Safari上注意到这种奇怪的行为，当同一表单中有密码字段时。我猜测，浏览器会寻找一个密码字段来插入您保存的凭据。然后它会自动填充（仅根据观察猜测）最接近的文本输入字段，即在DOM中出现在密码字段之前的字段。由于浏览器是最后一个实例，您无法控制它，有时甚至autocomplete=off也无法防止填写凭据。这个只读修复对我有用。

当您将顺序更改为“用户...密码...公司”时，它可以工作。同样，浏览器将使用密码之前的字段，现在是用户，来填写凭据。

修复浏览器自动填充： 设置readonly并在焦点（单击和Tab）上设置可写

 <input type="password" readonly  
     onfocus="$(this).removeAttr('readonly');"/>

- dsuess

Answer 7

我不确定我理解了你的问题。但是有一些提示：

您可以使用autocomplete告诉Chrome不要记住密码：http://www.w3schools.com/tags/att_input_autocomplete.asp

您可以使用tabindex更改文本框的选项卡顺序：http://www.w3schools.com/tags/att_global_tabindex.asp

- BCartolo

Answer 8

如果您的唯一问题是自动填充密码，您可以通过以下代码禁用它：

txtPass.Attributes.Add("autocomplete", "off");

- sr28

Answer 9

用于域名/公司名称：

<asp:TextBox id="Textbox1" runat="server" autocomplete="off"></asp:TextBox>

或者从 CodeBehind 中：

Textbox1.Attributes.Add("autocomplete", "off");

它将禁用文本框“company”的自动完成。

如果没有解决问题，替代的方法是使用一些验证，例如：

1. 输入域名/公司时，请检查是否提供了用户名。

2. 如果未提供用户名且密码存在，则先给出填写用户名的错误消息，然后故意清空公司和密码的文本框。

一些jQuery代码示例：

$(txtDomain).focusout(function() {
      if($txtUserName).val().trim()=="" && $(txtDomain).val().trim()!="" && $(txtPass).val().trim()!="")
      {
         alert('Please fill the username first');
         $(txtPass).val('');
         $(txtDomain).val('');
      }

我知道这不是一个好的解决方案，也存在可用性问题。但如果其他方法都不起作用，这可以是最后的手段。

希望能有所帮助。

- Pranav Singh

Answer 10

手动管理Cookie， 这是jQuery示例。

     $("#chkPersistCookie").change(function() {

        if(this.checked) {

        var username = $('#txtUser').attr("value");
        var password = $('#txtPass').attr("value");

        $.cookie('username', username, { expires: 14 });
        $.cookie('password', password, { expires: 14 });
        $.cookie('remember', true, { expires: 14 });

    } else {
        $.cookie('username', null);
        $.cookie('password', null);
        $.cookie('remember', null);

    }
    });

获取 cookie 并将其重新分配给控件，请使用以下代码：

var remember = $.cookie('remember');
    if ( remember == 'true' ) {

        $("#chkPersistCookie").attr("checked",true)
        var username = $.cookie('username');
        var password = $.cookie('password');

        $('#txtUser').attr("value", username);
        $('#txtPass').attr("value", password);
    }

- Britman

---

永远不要将密码存储在cookie中！ - Quintium

非常糟糕的想法。像上面那样的Cookie会以明文形式存储数据-1。 - Evert

我曾经使用过SSL，所以没有遇到任何安全问题。这就是我建议的原因。很抱歉给出了建议。！！ - Britman

SSL并不能防止Cookie被盗用！！ - GuyT

问题是关于公司登录框中的安全线程，他并没有询问整个系统的安全性。 - Britman