浏览器自动填充表单问题

2017-03-21 本文已影响1200人可惜没有如果R

浏览器记住密码的机制

首先理解浏览器保存密码和自动填充是两个机制，记住密码机制需要遵循同源策略

1.测试浏览器（mac）

| 浏览器 | 版本 |
| :--: | :--: | :--: |
| google | 56.0.2924.87 (64-bit) |
| firefox | 51.0.1 (64 位) |
| safari | 10.0 (12602.1.50.0.10) |
| ie(win) | 7-8 |

2.首先要分析浏览器是如何记住这个表单的，和唯一性？

 经过查资料实验得到的几个关键值
 1. 为了遵循同源策略，需要域名：lichenglong.pw
 2. 需要一个<form>标签
 3. 需要id或name为username的用户名<input>表单项
 4. 需要id或name为password的密码<input>表单项
 5. 用户名和密码框必须是上下级的关系，中间不能有其他input框

例如：

<form id="register5">
      <div class="form-group">
           <label>user name</label>
           <input type="text" name="username" class="form-control" placeholder="Enter text">
           <div class="tipinfo"></div>
      </div>
      <div class="form-group">
           <label>password</label>
           <input type="password" name="password" class="form-control" placeholder="Enter text">
           <div class="tipinfo"></div>
       </div>
       <button type="submit" class="btn btn-default">Submit Button</button>
</form>

各个浏览器提示保存密码截图
1.google

Paste_Image.png

2.firefox

Paste_Image.png

3.safari

Paste_Image.png

4.ie

Paste_Image.png

3.各浏览器的差异

Safari浏览器
只有Safari默认是关闭这个机制的。如果开启后，效果和chrome一样，非常好用！Safari不能自动填充表单
Opera浏览器
Opera好像很安全，记住密码后，浏览器并不会自动填充密码，而是要用户自己点击地址栏左边的钥匙图标，才会开始填充并登录。
IE8/9浏览器
IE8/9及部分这个内核的浏览器（比如遨游的IE模式）很聪明，将每个登录表单绑定到所在的页面上（下面简称这个页面为绑定页面），由于绑定页面地址是唯一的，同域内其他页面就无法通过生成一个一模一样的表单来获取密码了。
如果就这样还是不安全:P，因为XSS(获取浏览器记住的明文密码)可以动态iframe进这个绑定页面，然后注入JS进行任意DOM操作，同样非常容易获取到密码表单项的值，IE估计是考虑到了这个，通过iframe调用绑定页面也无效。而且IE的机制还远没这样简单，即使在绑定页面内我也没成功得到密码，因为IE默认并不填充密码，只有输入正确用户名后，并触发类似onblur事件，这个密码表单项才会填充进对应用户名的密码。这个过程我本想通过DOM来模拟进行的，但是没有成功。感兴趣的同学可以试试。
其他浏览器
其他浏览器（除了搜狗浏览器）都和Chrome差不多了，大多是因为webkit内核。
IE8/IE9无法自动完成表单及记住密码的解决方法
ie浏览器比较特殊点，有时候我们使用某些优化软件对系统进行优化以后，可能会出IE浏览器即便开启了自动完成功能也无法记住账号和密码的问题您也可以先检查IE浏览器的 Internet 选项里面是否启用了该功能，依次打开Internet 选项 —— 切换至“内容”选项卡 —— 自动完成设置，看是否勾选了“表单上的用户名和密码”。出现这种情况是因为IE浏览器的相应配置被禁用了，我们只要执行下面操作即可恢复。
1、按下 Win + R 键打开运行，在输入框中输入 gpedit.msc，单击确认打开本地组策略编辑器