jquerymobile - Chrome 不会在标准 POST 提交时提示保存密码

Posted 2023-05-08

【中文标题】jquerymobile - Chrome 不会在标准 POST 提交时提示保存密码

【英文标题】：jquerymobile - Chrome won't prompt to save password on standard POST submit

【发布时间】：2013-02-28 23:02:13

【问题描述】：

Chrome 提示保存密码的时间似乎不一致。考虑我网站上的以下两个过程...

转到主页

单击登录（这会将您带到 Login.php）

输入登录名/密码

您现在已登录，但 Chrome 没有提示您保存密码

不过……

转到主页

点击登录

刷新页面

输入登录名/密码

您现在已登录，Chrome 确实提示保存密码...

什么给了？唯一的区别是点击“刷新”。 Login.php 的代码非常非常简单...本质上是：

<form id="LoginForm1" action="Login.php" method="POST">
  <input type="text" name="UserName" />
  <input type="password" name="Password" />
  <input type="submit" value="Login" />
</form>

主页上有 javascript（jquery-1.7.2 和 jquery.mobile-1.3.0），但 Login.php 上没有。不过，它似乎继续存在，因为 Login.php 上的表单样式在刷新之前看起来像 jquerymobile。谁能解释这种行为？ （此外，为什么 jquery/jquerymobile 会禁止保存密码功能？）

在此先感谢...这是我提出的第一个问题。

【参考方案1】：

简答

从我的主页到 Login.php 的链接需要 data-ajax="false" 在 a href 标记中。

在我将 jquery-mobile 重新包含到 Login.php 后，Login.php 上的 form 标签也需要 data-ajax="false"。

 

长答案

第 1 部分

经过更多挖掘，我发现 jquery-mobile is to "hijack" all a href links and process them through its ajax functionality 的正常行为。这意味着它以 ajax 风格的传输方式传输到 Login.php，而不是标准的 a href 传输。标准传输会检查 Login.php 是否有其明确声明的 javascript 包含文件，但通过 javascript 包含的 ajax 传输来自主页。

但是...当您强制浏览器仅查看 Login.php（通过单击刷新）时，它发现没有任何 javascript 包含，因此 Chrome 浏览了裸页面并对其进行了正确处理。

 

第 2 部分

您必须满足几个要求，Chrome 才会提示保存密码。其中包括：

你必须使用 form 元素

您必须使用提交，而不是按钮

提交必须是真实的提交。 （如果您使用一些 javascript/Ajax 覆盖提交功能......它（可能）不会提示保存密码。）

页面加载时表单必须可见。

 

在使用 jquery-mobile 时，3 和 4 可能会绊倒你。

 

关于 3...

jquery-mobile 自动劫持表单提交过程，就像它处理链接的方式...所以有必要将 data-ajax="false" 添加到 form > 元素来防止它这样做。

 

关于 4...

我网站的第一个版本在主页上有一个登录 panel，登录按钮从页面“下方”显示面板。在我强制面板to be visible on page load 之前，此方法不会提示输入密码。

由于我不希望登录面板始终在主页上可见，因此我决定使用单独的登录页面 (Login.php)。然而，jquery-mobile 处理指向单独页面的链接的固有方法是使用其 ajax 功能来劫持它们……浏览器将其解释为停留在同一页面上。因此，对于 Chrome，导航到 Login.php 与使用隐藏面板相同......因为 Chrome 将这两个请求都解释为停留在主页上......在任何一种情况下，最初加载页面时表单元素都不可见.