javascript 如何通过在 CasperJs 中填写表格来登录
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18676549/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to Login by filling the form in CasperJs
提问by user2129794
Following is the hlml of the login form that I have
以下是我拥有的登录表单的 hlml
<div class="login_area_user">
<form method="post" action="https://www.tradus.com/login?dest_url=https://www.tradus.com/cart/select-address" id="user-login">
<input type="hidden" value="1" name="form_submit">
<h3 style="display:inline-block;">Already a Member</h3>
<p id="login-main-center-right-descp">You can use tradus login id and password</p>
<div class="login-row">
<label class="colorBlack">Email / Login*</label>
<input class="login-field" type="text" name="name" id="edit-namepopup">
</div> <!-- [/login-row] -->
<div class="login-row">
<label>Password</label>
<input class="login-field" type="password" id="edit-passpopup" name="pass">
</div> <!-- [/login-row] -->
<div class="login-row">
<a class="forgotPassword" href="/forgot_password">Forgot your password?</a>
<!--input type="checkbox" name="remember" /><span>Remember me</span-->
</div>
<div class="login-row">
<input class="login-button" value="Login" type="submit">
</div>
<input type="hidden" name="op" value="Log in">
</form>
</div>
Am using the following code to login :
我使用以下代码登录：
this.fill('form#user-login', {
'form_submit': 1,
'name': '[email protected]',
'pass': 'pwd',
'op': 'Log in'
}, true);
But I dont thing its doing the thing for me.
但我不认为它为我做这件事。
回答by Shikhar
casper.waitForSelector("form input[name='name']", function() {
this.fillSelectors('form#user-login', {
'input[name = name ]' : '[email protected]',
'input[name = pass ]' : 'pwd'
}, true);
});
Simply use this (see waitForSelector docs). Firstly, wait for the form to be loaded. Then fill the form using the selectors.
只需使用它（请参阅waitForSelector 文档）。首先，等待表单加载。然后使用选择器填写表单。
回答by tadashigaki
casper.waitForSelector('form', function(){
this.fill('form', {
'name': '[email protected]',
'pass': 'pwd'}, true);
});
<!-- wait until a form tag disappears -->
casper.waitWhileSelector('form', function(){
this.echo('selector is no more!');
});
casper.then(function(){
this.echo(this.getTitle());
});
回答by twill
In case anyone else finds this.. I used some combination of these answers - my login form was also in an iframe which added some difficulty, but basically the issue I saw (cookie-based login) is that casper was going to the next step before the server could respond and set the cookie. I added some .wait() callbacks to ensure enough time to get that cookie. It may not be foolproof, but I have yet to have an issue with it
万一其他人发现这个..我使用了这些答案的一些组合 - 我的登录表单也在 iframe 中，这增加了一些困难，但基本上我看到的问题（基于 cookie 的登录）是 casper 将要进行下一步在服务器可以响应并设置 cookie 之前。我添加了一些 .wait() 回调以确保有足够的时间来获取该 cookie。它可能不是万无一失的，但我还没有遇到问题
Mind you, the cookie needs to be set EVERY CRAWL
请注意，每次抓取都需要设置 cookie
casper.start(config.loginUrl, function() {
console.log("Checking login status @ " + config.loginUrl);
// set a wait condition to make sure the page is loaded (particularly iframe in my case)
this.wait(5000,function(){
// switch to iframe (won't be necessary for most)
this.page.switchToChildFrame('login');
// fill out the form
this.fillSelectors("form[name='loginForm']",{
'input#txtUsername' : config.username,
'input#txtPassword' : config.password
});
// click the login button
console.log("Logging In...")
this.click('input.button.login');
// ** give my crappy dev server 5 seconds to respond
this.wait(5000,function(){
console.log('Starting to spider ' + dataObj.start)
// do yo dance
spider(dataObj.start);
});
回答by ringular
Hmmm.. Follow that with:
嗯.. 跟随：
casper.then(function () {
this.evaluate(function () {
$('form#user-login').submit();
});
});
