使用 JavaScript 在 UIWebView 中查找和自动填充 HTML 登录表单 [英] Finding and auto-filling HTML login forms in a UIWebView using JavaScript

问题描述

我有一个 UIWebView，它的作用类似于互联网浏览器并加载它所在网页的 HTML.

i have a UIWebView which acts like an internet browser and loads the HTML of the webpages that it is at.

在 webViewController 中，webViewDidFinishLoad 方法会在网页完成加载到 UIWebView 时从网页加载 HTML.

in the webViewController, the method webViewDidFinishLoad, would have loaded the HTML from the webpage when the webpage finish loading on the UIWebView.

我想从 HTML 中筛选文本字段，以方便使用存储在我的数据库中的值自动填充该文本字段.

From the HTML i would like to sieve out textfields to facilitate the auto population of that textfield with values stored in my database.

有什么方法可以做到吗?该方法应该能够在所有网站上运行.

Any methods to do that? The method should be able to work on all websites.

在 UIWebView 中为文本字段设置文本 几乎可以帮助我，但我已经尝试过了，文本字段从来没有被填满.

Set text for a textfield in UIWebView has almost what might help me, but i have tried it and the text field never got filled.

在登录页面中会有两个文本字段所以我尝试使用

In a login page there will be two text fields so i tried using

document.getElementsByTagName('INPUT')[0].value
document.getElementsByTagName('INPUT')[1].value 

输入值但没有魔法.

我尝试了数组中的其他位置.Facebook 的用户名和密码是 [3] 和 [4]，而亚马逊的用户名和密码是 [11] 和 [14].所以使用上述方法的字段的位置有点随机.还有其他适用于所有网站的建议吗?

i have tried other position in the array. the username and password for Facebook is [3] and[4] whereas for amazon it is [11] and [14]. so the position of where the fields are using the above method is kinda random. Any other suggestion that will work for all website?

我可以试试

document.getElementsById('id_name').value

但是 ID 方法对我不起作用，因为我需要一个通用方法来识别任何网站上的文本字段(所有网站都使用不同的 ID 名称)

but the ID method is not going to work for me as i need a universal method that will identify textfields on any websites(all websites uses different ID names)

在我看来，有些网站一直将这个 tabindex="1" 设置为用户名，将 tabindex="2" 设置为密码.

Also it seems to me that some of the websites have consistently set this tabindex="1" for username and tabindex="2" for password.

例如在 Facebook 等网页中:

for instance in the webpage like Facebook:

<input type="text" class="inputtext" name="email" id="email" value="" tabindex="1" />
<input type="password" class="inputtext" name="pass" id="pass" tabindex="2" /> 

亚马逊:

<input id="ap_email" name="email" value="" type="email" size="30" maxlength="128" tabindex="1" autocorrect="off" autocapitalize="off" />
<input id="ap_password" name="password" type="password" maxlength="1024" size="20"  tabindex="2" onkeypress="displayCapsWarning(event,'ap_caps_warning', this);" class="password"/> 

dbs 银行:

<input type="text" tabindex="1" maxlength="20" size="32" name="UID" id="UID">
<input type="password" onkeyup="keyUp(event)" onkeydown="return onlyNumerics(event)" tabindex="2" maxlength="9" size="32" name="PIN" id="PIN" autocomplete="off">

但我在 google 中没有看到这个 tabindex:

but i didn't see this tabindex in google:

<input type="text" spellcheck="false" name="Email" id="Email" value="">
<input type="password" name="Passwd" id="Passwd">

有什么建议吗?

最终目标是能够筛选出所有/任何网站的用户名和密码文本字段.=)

The Ultimate goal is to be able to sieve out Username and Password Text field for all/any websites. =)

推荐答案

好的，所以没有万能的.您可以非常接近，但它永远不会在每个网站上运行，因为一个网站可能有多个登录表单，或者构成用户名的多个字段(有些银行有).

OK, so there's no one-size-fits-all for this. You can get pretty close, but it will never work on every website, since a website could possibly have multiple login forms, or multiple fields that make up the username (some banks have that).

但这会让你朝着正确的方向前进.要获取所有密码字段(大部分只有一个)，请使用:

But this will get you in the right direction. To get all the password fields (mostly just one), use this:

document.querySelectorAll("input[type='password']")

要获取所有文本输入字段，请使用:

To get all the text input fields, use this:

document.querySelectorAll("input[type='text']")

对于文本输入字段，您很可能会得到多个结果(可能是搜索字段等).因此，您必须遍历它们并查找常见的 ID 或名称，例如用户名"、用户"、用户名"、UID"等.

For the text input fields, you'll most likely get multiple results (maybe search fields and stuff). So you'll have to iterate over them and look for common IDs or names, like "username", "user", "user_name", "UID" and so on.

这就是你可以在 Objective-C 中使用它的方式:

This is how you could use it in Objective-C:

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    NSString *savedUsername = @"peter";
    NSString *savedPassword = @"Pan123";

    if (savedUsername.length != 0 && savedPassword.length != 0) { 
        //create js strings
        NSString *loadUsernameJS = [NSString stringWithFormat:@"var inputFields = document.querySelectorAll("input[type='text']"); 
        for (var i = inputFields.length >>> 0; i--;) { inputFields[i].value = '%@';}", savedUsername];
        NSString *loadPasswordJS = [NSString stringWithFormat:@"document.querySelectorAll("input[type='password']").value ='%@'", savedPassword];

        //autofill the form
        [self.webView stringByEvaluatingJavaScriptFromString: loadUsernameJS];
        [self.webView stringByEvaluatingJavaScriptFromString: loadPasswordJS];
    }
}

请注意:它用用户名填充每个文本字段，并且只用密码填充第一个密码字段.

Please note: It fills every textfield with the username and only the first password field with the password.

享受吧.

这篇关于使用 JavaScript 在 UIWebView 中查找和自动填充 HTML 登录表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！